2017-10-12 29 views
0

我想實現ng4-material-dropdown執行一條錯誤消息角4個下拉結果

步驟我做:

1)我已經安裝:

npm install ng4-material-dropdown --save 2)Once installed, import the directives:

app.module.ts

import { NgModule } from '@angular/core'; 
import { BrowserModule } from '@angular/platform-browser'; 
import { FormsModule } from '@angular/forms'; 
import { HttpModule } from '@angular/http'; 
import { AppComponent } from './app.component'; 
import { routing } from './app.routing'; 
import { AgmCoreModule } from '@agm/core'; 
import { customHttpProvider } from './_helpers/index'; 
import { AlertComponent } from './_directives/index'; 
import { AuthGuard } from './_guards/index'; 
import { AlertService, AuthenticationService, UserService } from './_services/index'; 
import { HomeComponent } from './home/index'; 
import { LoginComponent } from './login/index'; 
import { RegisterComponent } from './register/index'; 
import { HeaderComponent } from './header/header.component'; 
import { DashboardComponent } from './dashboard/index'; 
import { Ng4DropdownModule } from 'ng4-material-dropdown'; 

@NgModule({ 
imports: [ 
    BrowserModule, 
    FormsModule, 
    HttpModule, 
    AgmCoreModule.forRoot({ 
    apiKey: 'eer' 
    }), 
    Ng4DropdownModule, 
    routing 
], 
declarations: [ 
    AppComponent, 
    AlertComponent, 
    HomeComponent, 
    LoginComponent, 
    RegisterComponent, 
    HeaderComponent, 
    DashboardComponent 
], 
providers: [ 
    customHttpProvider, 
    AuthGuard, 
    AlertService, 
    AuthenticationService, 
    UserService 
], 
bootstrap: [AppComponent] 
}) 

導出類AppModule {}

3)我曾經在我的dashboard.component.html文件:

dashboard.component.html

<app-header></app-header> 
<div class="container"> 
<ng4-dropdown> 
<ng4-dropdown-menu> 
    <ng4-menu-item *ngFor="let item of items"> 
     {{ item }} 
    </ng4-menu-item> 
    </ng4-dropdown-menu> 
</ng4-dropdown> 

<agm-map [latitude]="lat" [longitude]="lng"> 
    <agm-marker 
      [latitude]="lat" 
      [longitude]="lng"></agm-marker> 
</agm-map> 
</div> 

dashboard.component.ts

import { Component, OnInit } from '@angular/core'; 
import { Router, ActivatedRoute } from '@angular/router'; 
import { AlertService, AuthenticationService } from '../_services/index'; 

@Component({ 
    moduleId: module.id, 
    templateUrl: './dashboard.component.html', 
    styleUrls: ['./dashboard.component.css'] 
}) 
export class DashboardComponent implements OnInit { 
title: string = 'My first AGM project'; 
    lat: number = 51.673858; 
    lng: number = 7.815982; 
    ngOnInit() { 
    } 

pages =['abc','bca','pqr']; 


    constructor() { 
    } 
} 

當我嘗試了,我得到以下錯誤:

TypeError: Cannot read property 'setGlobalVar' of null 
    at _createNgProbe (ng4-dropdown.bundle.js:6944) 
    at eval (module.ngfactory.js? [sm]:1) 
    at _callFactory (core.es5.js:9574) 
    at _createProviderInstance$1 (core.es5.js:9503) 
    at initNgModule (core.es5.js:9454) 
    at new NgModuleRef_ (core.es5.js:10568) 
    at createNgModuleRef (core.es5.js:10552) 
    at Object.debugCreateNgModuleRef [as createNgModuleRef] (core.es5.js:12861) 
    at NgModuleFactory_.webpackJsonp.../../../core/@angular/core.es5.js.NgModuleFactory_.create (core.es5.js:13856) 
    at core.es5.js:4497 

您能否請te我在這裏做錯了什麼,這個錯誤是什麼意思?

回答

0

模塊未初始化。您可以在node_module中看到ng4-dropdown.bundle.js,並在此函數中搜索函數名稱'initDomAdapter'.add調試器,它不會運行。

+0

感謝您的迴應...是啊這個功能沒有被調試器擊中..如何解決這個問題? – Merdekar

+0

你可以下載他的演示。將他的src/modules複製到你的項目中並使用它。 –

+0

從他的github –