無法綁定到'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

回答

相關問題