无法绑定到'ngModel'，因为它不是'input'的已知属性。测试.spec.ts

我已经被链接到另一张票。这个错误只发生在测试中，并且我已经为每个链接消息导入了FormsModule。我正在使用Angular 2.2.1。无法绑定到'ngModel'，因为它不是'input'的已知属性。测试.spec.ts

ngModel在'ng test'中没有定义我导入了FormsModule和ReactiveFormsModule没有任何效果。我一直在研究这个24小时，我没有更接近。大多数与升级有关，我用相同的问题擦除并重新启动，当使用ng generate创建时，测试模板非常光滑。

我用角CLI构建我的应用程序（并重建它...）和我已经加入的形式导入，因为它似乎很重要。

这里是我的简单的模板，请注意，这不是一个形式，而是一个div，它使没有区别。 'ng serve'看起来很合理，所以代码在理论上是正确的。

这里是我的形式...

<form class="form-horizontal"> 
    <div class="form-group"> 
    <label class="col-sm-2 control-label" for='line1'>Address 1</label> 
    <div class="col-sm-10"> 
     <input type="text" class="form-control" placeholder="Line 1" id='line1' [(ngModel)]='address.line1' required> 
    </div> 
    </div> 
    <div class="form-group"> 
    <label for="inputPassword" class="col-sm-2 control-label" for='line2'>Address 2</label> 
    <div class="col-sm-10"> 
     <input type="text" class="form-control" id="line2" placeholder="Line 2" [(ngModel)]='address.line2'> 
    </div> 
    </div> 
    <div class="form-inline"> 
    <div class="form-group"> 
     <label for="inputPassword" class="col-sm-2 control-label" for='Suburb'>Suburb</label> 
     <div class="col-sm-6"> 
     <input type="text" class="form-control" id="suburb" placeholder="Suburb" [(ngModel)]='address.suburb'> 
     </div> 
     <div class="col-sm-2"> 
     <input type="text" class="form-control" id="State" placeholder="State" [(ngModel)]='address.state'> 
     </div> 
     <div class="col-sm-2"> 
     <input type="text" class="form-control" id="postcode" placeholder="Postcode" [(ngModel)]='address.postcode'> 
     </div> 
    </div> 
    </div> 
</form>

这里是我的测试规范，我加入CommonModule和ReactiveFormsModule和FormsBuilder大量的研究后，没有喜悦。

/* tslint:disable:no-unused-variable */ 

import { TestBed, async } from '@angular/core/testing'; 
import { CommonModule } from '@angular/common'; 
import { FormsModule, ReactiveFormsModule, FormBuilder } from '@angular/forms'; 


import { AddressComponent } from './address.component'; 
import { Address } from './address'; 

describe('Component: Address',() => { 
    beforeEach(() => { 
    TestBed.configureTestingModule({ 
     declarations: [AddressComponent], 
     imports: [CommonModule, ReactiveFormsModule], 
     providers: [FormBuilder] 
    }); 
    }); 

    it('should create an instance',() => { 
    let component = new AddressComponent(); 
    expect(component).toBeTruthy(); 
    }); 

    it('should handle address',() => { 
    expect(true).toBeTruthy(); 
    }); 

});

这是我的组件。很简单...

import { Input, Component, OnInit } from '@angular/core'; 
import { Address } from './address'; 

@Component({ 
    selector: 'app-address', 
    templateUrl: './address.component.html', 
    styleUrls: ['./address.component.css'], 
}) 

export class AddressComponent implements OnInit { 

    @Input() address: Address; 

    constructor() { } 

    ngOnInit() { 
    } 

}

错误我得到的是：

"): [email protected]:78 
Can't bind to 'ngModel' since it isn't a known property of 'input'. ("iv class="col-sm-10"> 
     <input type="text" class="form-control" id="line2" placeholder="Line 2" [ERROR ->][(ngModel)]='address.line2'>

来源

2016-12-01 KenF

我使用我使用的是刚生成的应用程序采用了棱角分明的CLI RC5 NIT 。它适用于ng服务。测试问题仅 – KenF

http://stackoverflow.com/questions/40373099/angular2-quickstart-tutorial-breaking-karma-tests-cant-bind-to-ngmodel-sin –

添加FormsModule以及

imports: [CommonModule, ReactiveFormsModule, FormsModule],

来源

2016-12-02 11:49:25

无法绑定到'ngModel'，因为它不是'input'的已知属性。测试.spec.ts

回答

相关问题