在创建模型驱动模板Reactive表单时,我从Form Value创建模型对象时.然后模型对象失去其TYPE.
对于一个简单的例子：
模特班书：
export class Book {
public name: string;
public isbn: string;
}
零件：
@Component({
selector: 'app-book',templateUrl: './book.component.html',styleUrls: ['./book.component.css']
})
export class BookComponent implements OnInit {
bookFormGroup: FormGroup;
private newBook: Book = new Book();
constructor(private fb: FormBuilder) {
this.bookFormGroup = this.fb.group({
name: new FormControl(''),isbn: new FormControl('')
});
}
ngOnInit() {
}
addBook() {
console.log('submit');
this.newBook = <Book> this.bookFormGroup.value;
console.log(this.newBook instanceof Book);
console.log(this.newBook);
}
}
HTML：
<form [formGroup]="bookFormGroup" (ngSubmit)="addBook()">
<input type="text" formControlName="name" >
<input type="text" formControlName="isbn" >
<input type="submit" value="Submit">
</form>
在上面的例子中,在填充newBook实例后将其转换为普通的Object
即,
在此之后.newBook =< Book> this.bookFormGroup.value;
这个.newBook instanceof Book变得虚假
我该如何防止这种情况？
或者有更好的方法来实现这一目标吗？
注意：我尝试使用JSON.parse(),但它仍然相同.
此构造函数将适用于任何类型,并将分配任何匹配的字段.
export class Book {
public constructor(init?: Partial<Book >) {
Object.assign(this,init);
}
}
所以你将能够做到这一点：
this.newBook = new Book(this.bookFormGroup.value);
如果Book课程将来会有任何变化并且变得更大,这将为您提供大量工作.
