如何使用Angular 4中的控件創建假表單？

Question

我有一個接收表單並將控件標記爲髒的函數。

我不知道如何手動創建一個假表單的實例作爲單元測試中的替代品。

markControlDirty(form: NgForm) { 
    let firstControl = form.controls[Object.keys(form.controls)[0]]; 
    firstControl.markAsDirty(); 
} 

我試圖從這個網站的其他答案下面的代碼片段，但不包括任何控制，所以我的代碼上，因爲form.controlsObject.keys(form.controls)失敗未定義：

let fakeForm = <NgForm> { 
    value: { 
    name: 'Hello', 
    category: 'World' 
    } 
}; 

Answer 1

您可以使用FormBuilder可以根據您希望的任何對象創建虛擬表單組。然後，如果你需要模擬一些行爲，茉莉花提供spyOnProperty方法，它可以讓你嘲笑價值/控制或其他任何readOnly屬性（這在處理表單時非常有用）的返回值。

https://jasmine.github.io/api/edge/global.html#spyOnProperty

我將如何創建我的虛擬形式：

const myModel = { 
    name: 'Hello', 
    category: 'World' 
}; 
const fb = new FormBuilder(); 
const form = fb.group(myModel); 

然後你就可以在任何窺探你要感謝spyOnProperty。

例如：

spyOnProperty(form, 'valid', 'get').and.returnValue(false);