導入flexLayout後Angular2應用程序不工作

我想在angular2材質中使用flexLayout創建窗體。它給出了syntaxError。導入flexLayout後Angular2應用程序不工作

的SyntaxError {_nativeError：錯誤：意外的值 '未定義' 由模塊 '的AppModule' 在SyntaxError.BaseError進口...}

這是我app.module.ts

import 'hammerjs'; 

import { BrowserModule } from '@angular/platform-browser'; 
import { NgModule } from '@angular/core'; 
import { FormsModule } from '@angular/forms'; 
import { HttpModule, JsonpModule } from '@angular/http'; 

import { MaterialModule } from '@angular/material'; 
import { AppComponent } from './app.component'; 

import { LoginComponent } from './modules/login/login.component'; 
import { Angular2RoutingModule } from './app-routing.module'; 
import { WorkflowComponent } from './modules/workflow/workflow.component'; 
import { WorkflowHomeComponent } from './modules/workflow/workflow-home/workflow-home.component'; 
import { AdminComponent } from './modules/admin/admin.component'; 
import { AdminHomeComponent } from './modules/admin/admin-home/admin-home.component'; 
import { ProfileComponent } from './modules/profile/profile.component'; 

import { FlexLayoutModule, ObservableMedia } from '@angular/flex-layout'; 

@NgModule({ 
    declarations: [ 
    AppComponent, 
    LoginComponent, 
    WorkflowComponent, 
    WorkflowHomeComponent, 
    AdminComponent, 
    AdminHomeComponent, 
    ], 
    imports: [ 
    BrowserModule, 
    MaterialModule.forRoot(), 
    FlexLayoutModule, 
    FormsModule, 
    HttpModule, 
    Angular2RoutingModule, 
    JsonpModule, 
    ], 
    entryComponents: [AppComponent], 
    providers: [], 
    bootstrap: [AppComponent] 
}) 
export class AppModule { } 

This is my profile.component.html: 

<md-card class="demo-card demo-basic"> 
     <md-card-content class="flex-container" style="width: 100%" fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center center" fxLayoutAlign.xs="start"> 
     <form> 
     <div class="flex-container" fxLayout="row" fxLayout.xs="column"> 
      <div class="flex-item" fxFlex="30%" fxFlex.xs="40%"> 
      <md-input class="user-name" placeholder="User Name (disabled)" disabled value="Google"> 
      </md-input> 
      </div> 
      <div class="flex-item" fxFlex="30%" fxFlex.xs="40%"> 
      <md-input class="e-mail" placeholder="E-mail (disabled)" disabled value="Google"> 
      </md-input> 
      </div> 
      <div class="flex-item" fxFlex="30%" fxFlex.xs="40%"> 
      <md-input class="company" placeholder="Company (disabled)" disabled value="Google"> 
      </md-input> 
      </div> 
     </div> 

    </form> 
</md-card-content> 
</md-card>

來源

2017-02-14 SujaniWickramasinghe

您正在從'@ angular/flex-layout'中導入'ObservableMedia'，然後您不使用它。你確定這是一個有效的導入？ –

是的。我用它來使用angular2材質隱藏側面導航。你給我一個答案。這是正確的。但我想隱藏側面導航使用angular2材料。我沒有把整個代碼profile.component.html文件在這裏。爲此，還需要導入flex-layout.But在導入flex-layout時會給出syntaxError。 – SujaniWickramasinghe

我解決了我的問題。在beta.5版本中導入flex-layout時，應該是這樣的。

import { FlexLayoutModule } from '@angular/flex-layout/flexbox';

來源

2017-02-15 05:24:18 SujaniWickramasinghe

你必須做的是停止使用intelliej或webstorm和cd到您的應用程序根目錄，並提供服務它將解決問題

來源

2017-02-14 18:35:28

不幸的是，它沒有奏效。它仍然給以前的語法錯誤。 – SujaniWickramasinghe

導入flexLayout後Angular2應用程序不工作

回答

相關問題