AngularJS 2：无法绑定到“ngModel”，因为它不是“输入”的已知属性答案

【问题标题】：AngularJS 2: Can't bind to 'ngModel' since it isn't a known property of 'input'AngularJS 2：无法绑定到“ngModel”，因为它不是“输入”的已知属性
【发布时间】：2017-08-12 23:19:45
【问题描述】：

我在启动我的应用程序时遇到了这个错误。我做错了什么？我已经在我的模块中导入了 FormsModule 和 ReactiveFormsModule 包。我正在使用 Angular 2.4.9

app.module.ts：

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

import { AppComponent }   from './app.component';
import { PainelComponent } from './painel/painel.component';

import { PainelModule } from './painel/painel.module';
import { SidebarModule } from './sidebar/sidebar.module';
import { FooterModule } from './shared/footer/footer.module';
import { NavbarModule} from './shared/navbar/navbar.module';

import { HashLocationStrategy, LocationStrategy } from '@angular/common';

@NgModule({
    imports:      [
        BrowserModule,
        PainelModule,
        SidebarModule,
        NavbarModule,
        FooterModule,
        FormsModule,                               
        ReactiveFormsModule,      
        RouterModule.forRoot([])
    ],
    declarations: [ AppComponent, PainelComponent ],
    providers: [{provide: LocationStrategy, useClass: HashLocationStrategy}],
    bootstrap:    [ AppComponent ]
})
export class AppModule { }

控制台显示如下：

Unhandled Promise rejection: Template parse errors:
Can't bind to 'ngModel' since it isn't a known property of 'input'. (""for="">RA <span class="star">*</span></label><input type="text" [ERROR ->][(ngModel)]="myModel" />{{myModel}}</"): AlunoComponent@10:51 ; Zone: <root> ; Task: Promise.then ; Value:

app.component.ts

import { Component, OnInit } from '@angular/core';
import { Router, ActivatedRoute } from '@angular/router';
import {Location, LocationStrategy, PathLocationStrategy} from '@angular/common';

@Component({
    selector: 'my-app',
    templateUrl: 'app/app.component.html'
})

export class AppComponent implements OnInit{
    location: Location;
    constructor(location:Location) {
        this.location = location;
    }
    ngOnInit(){
        $.getScript('dashboard.js');
    }
    public isMaps(path){
        var titlee = this.location.prepareExternalUrl(this.location.path());
        titlee = titlee.slice( 1 );
        if(path === titlee){
            return true;
        }
        else {
            return false;
        }
    }
}

我在做一个测试，所以 HTML 页面很简单

HTML 页面：

<div class="form-group">
<label class="control-label" for="">RA </label>
<input type="text" [(ngModel)]="myModel" />{{myModel}}</div>

【问题讨论】：

您正在使用哪个版本的 Angular。你也可以发布html吗？
我使用的是 Angular 2.4.9

标签： angular typescript

【解决方案1】：

我创建了一个具有相同版本 (2.4.9) 角度的示例，它对我来说工作正常。我认为您的组件上没有声明 myModel 属性

https://plnkr.co/edit/Hmq6bdXkeaK3HQ33WCXX?p=preview

<input [(ngModel)]="myModel" placeholder="">

@Component({
    selector: 'app',
    templateUrl: "src/app.html"
})
export class App {
myModel:string="test";
    constructor() {

    }
}

【讨论】：