2017-09-26 32 views
1

我被困在 ”无法绑定到'ngModule',因为它不是'select'的已知属性。“错误。 解决方案应该在app.module.shared.ts文件中导入FormsModule。我做了,但我仍然得到相同的错误。Angular 4.错误“无法绑定到'ngModule',因为它不是”已知的属性“,但FormsModule导入到app.module.shared.ts

app.module.shared.t

import { NgModule } from '@angular/core'; 
import { FormsModule } from '@angular/forms'; 
import { CommonModule } from '@angular/common'; 
import { HttpModule } from '@angular/http'; 
import { RouterModule } from '@angular/router'; 
import { AppComponent } from './components/app/app.component'; 
import { NavMenuComponent } from './components/navmenu/navmenu.component'; 
import { HomeComponent } from './components/home/home.component'; 
import { StatisticComponent} from './components/statistic/statistic.component'; 
import { StatisticViewComponent } from './components/statisticview/statisticview.component'; 
import { StatService } from './components/services/stat.service'; 


@NgModule({ 
    declarations: [ 
     AppComponent, 
     NavMenuComponent, 
     HomeComponent, 
     StatisticComponent, 
     StatisticViewComponent 
    ], 
    imports: [ 
     FormsModule, 
     CommonModule, 
     HttpModule, 
     RouterModule.forRoot([ 
      { path: '', redirectTo: 'home', pathMatch: 'full' }, 
      { path: 'home', component: HomeComponent }, 
      { path: 'statistic', component: StatisticComponent }, 
      { path: 'statisticview', component: StatisticViewComponent }, 
      { path: '**', redirectTo: 'home' } 
     ]) 
    ], 
    providers: [ 
     StatService 
    ] 
}) 
export class AppModuleShared { 
} 

statisticview.component.ts

import { StatService } from './../services/stat.service'; 
import { Component, OnInit } from '@angular/core'; 

@Component({ 
    selector: 'app-statistic-view', 
    templateUrl: './statisticview.component.html', 
    styleUrls: ['./statisticview.component.css'] 
}) 
export class StatisticViewComponent implements OnInit { 
    private affiliates:string[] 
    selectedAffiliate: any; 

    constructor(private statService: StatService) { 
    } 

    ngOnInit(): void { 
    this.statService.getAvailableAffiliates().subscribe(s => { 
     this.affiliates = s; 
     console.log(s); 
     }) 
    } 

    OnAffiliateChange() { 
    console.log(this.selectedAffiliate) 
    } 

} 

statisticview.component.html

<div class="row"> 
    <div class="form-group"> 
     <label for="aff">Affiliate</label> 
     <select name="aff" id="aff" class="form-control" (change)="OnAffiliateChange()" [(ngModule)] ="selectedAffiliate"> 
      <option value=""></option> 
      <option *ngFor="let a of affiliates" value="{{a}}">{{a}}</option> 
     </select> 
    </div> 
</div> 

从的package.json

"dependencies": { 
    "@angular/animations": "4.2.5", 
    "@angular/common": "4.2.5", 
    "@angular/compiler": "4.2.5", 
    "@angular/compiler-cli": "4.2.5", 
    "@angular/core": "4.2.5", 
    "@angular/forms": "4.2.5", 
    "@angular/http": "4.2.5", 
    "@angular/platform-browser": "4.2.5", 
    ........ 

回答

4

应该ngModel,而不是NgModule

<select name="aff" id="aff" class="form-control" (change)="OnAffiliateChange()" [(ngModel)] ="selectedAffiliate"> 
      <option value=""></option> 
      <option *ngFor="let a of affiliates" value="{{a}}">{{a}}</option>   
    </select> 
+0

但它是ngModel,在所列出的标记 – Alexander

+0

这就是提到右 – Sajeetharan

+0

对不起,你是对的不NgModule。我在查看评论中名字较低和大写的第一个字母,并错过了整个单词是错误的。应该是ngModel而不是ngModule – Alexander

相关问题