我尝试在我的应用程序中使用2.0.0-beta.9,一个简单的测试不起作用
<div fxLayout="row">
<div>1. One</div> <div>2. Two</div> <div>3. Three</div> <div>4. Four</div>
</div>
显示列而不是行
我想我正在正确地导入库
import {Component,NgModule} from '@angular/core'
import {BrowserModule} from '@angular/platform-browser'
import {FlexLayoutModule} from "@angular/flex-layout";
import {TestApp} from "./test-app";
@NgModule({
imports: [
BrowserModule,FlexLayoutModule
],declarations: [ TestApp ],bootstrap: [ TestApp ]
})
export class TestAppModule {
}
解决方法
当我安装持续的flex-layout模块时,我也遇到了这些问题.问题是指令名称的变化.
在 website中,所有指令都像layout,layout-xs,flex等…
在 website中,所有指令都像layout,layout-xs,flex等…
根据我的解决方案,指令名称更改为fx PascalCase.
例
layout -> fxLayout flex -> fxFlex flex-order -> fxFlexOrder flex-order-gt-md -> fxFlexOrder.gt-md
如果您查看Layout and Container,您将看到如下图像.
<div fxLayout="row">
<div fxFlex>First item in row</div>
<div fxFlex>Second item in row</div>
</div>
<div fxLayout="column">
<div fxFlex>First item in column</div>
<div fxFlex>Second item in column</div>
</div>