角Flex的佈局 - 不工作

我試圖用2.0.0-beta.9在我的應用程序，一個簡單的測試不起作用角Flex的佈局 - 不工作

<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 { 

}

來源

2017-09-25 user1916077

它應該工作... 嘗試刪除node_modules比運行npm install並再試一次。 – ShadowFoOrm

嘗試使用角度版本4這是最新的測試版已過時 –

你是缺少2「;」從'@ angular/core'導入{Component，NgModule}; 從'@ angular/platform-browser'導入{BrowserModule}; – ShadowFoOrm

您可能在前2次導入後忘記了分號。

import {Component, NgModule} from '@angular/core'; 
import {BrowserModule} from '@angular/platform-browser';

來源

2017-10-03 14:32:31

我有同樣的問題，請任何人的幫助。 –

我需要某個地方來檢查我們的代碼。如果可以，請創建一個問題並將其鏈接到那裏！ –

謝謝它已完成。 –

當我安裝持續的flex-layout模塊時，我也遇到了類似的問題。問題是指令名稱更改。在website，所有的指令都像layout，layout-xs，flex等等

根據我的解決方案，directive名稱更改爲fx + PascalCase。

例

layout -> fxLayout 
flex -> fxFlex 
flex-order -> fxFlexOrder 
flex-order-gt-md -> fxFlexOrder.gt-md

如果檢查Layout and Container，你會看到如下的圖像。

更改上面的代碼爲以下，這對我來說是OK。

<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>

來源

2018-02-21 08:46:37 CycDemo

角Flex的佈局 - 不工作

回答

相關問題