flex-sm模擬角材料2應用

Question

這是代碼與angularjs材料一起使用。

<div flex="50" flex-sm="100"> 
    Some data 
</div> 

我該如何在我的Angular material 2應用程序中實現它？

Answer 1

按照以下步驟得到它的工作：

1. 安裝flex-layout依賴性：

   npm install @angular/flex-layout 
   

2. 導入FlexLayoutModule您AppModule：

   import { FlexLayoutModule } from '@angular/flex-layout'; 
   import { NgModule } from '@angular/core'; 
   
   @NgModule({ 
       imports: [ 
        FlexLayoutModule, 
        // Other modules 
       ] 
   }) 
   export class AppModule {} 
   

3. 更改您的密碼到以下內容：

   <div fxFlex="50%" fxFlex.sm="100%"> 
       Some data 
   </div> 
   

   • Flex layout demo website