Các hình thức trong Angular 2 RC4

Question

Tôi đang thử nghiệm các biểu mẫu trong Angular 2 RC4. Đó là tất cả làm việc tốt nhưng khi tôi bắt đầu ứng dụng trình duyệt giao diện điều khiển mang lại cho tôi tin nhắn này:

*It looks like you're using the old forms module. This will be opt-in in the next RC, and will eventually be removed in favor of the new forms module. 

Phần liên quan của thành phần của tôi trông như thế này:

import { 
    FORM_DIRECTIVES, 
    REACTIVE_FORM_DIRECTIVES, 
    FormBuilder, 
    FormGroup 
} from '@angular/forms'; 
import {Observable} from "rxjs/Rx"; 

@Component 
({ 
    selector: "hh-topbar", 
    moduleId: module.id, 
    templateUrl: "topBar.component.html", 
    directives: [HHPagerComponent, FORM_DIRECTIVES, REACTIVE_FORM_DIRECTIVES] 
}) 

export class HHTopBarComponent implements OnChanges, OnInit 
{ 
    ... 
    private filterForm: FormGroup; 
    private title$: Observable<string>; 

    constructor(private formBuilder: FormBuilder) 
    { 
    } 

    public ngOnInit(): any 
    { 
     this.filterForm = this.formBuilder.group 
     ({ 
      "title": [this.info.filters.searchFileName] 
     }); 

     this.title$ = this.filterForm.controls["title"].valueChanges; 
     this.title$.subscribe(val => 
     { 
      this.info.filters.searchFileName = val; 
      this.filterChanged.emit(this.info.filters); 
     }); 
    } 
} 

Và phần liên quan của mẫu của tôi trông giống như sau:

<form [formGroup]="filterForm"> 
    <div> 
     <label for="title">Title</label> 
     <input [formControl]="filterForm.controls['title']" id="title" /> 
    </div> 
</form> 

Có ai ở đây biết mô-đun biểu mẫu mới mà cảnh báo đang nói đến và chỉ thị nào sẽ thay đổi và điều gì?

Answer 1

Bạn cần phải vô hiệu hóa một cách rõ ràng sự ủng hộ hình thức phản đối khi bootstrapping ứng dụng của bạn:

import {disableDeprecatedForms, provideForms} from '@angular/forms'; 

bootstrap(AppComponent, [ 
    disableDeprecatedForms() 
    provideForms() 
]); 

Trong khi FormBuilder không được chấp nhận, bạn có thể sử dụng trực tiếp các lớp FormGroup thay vì:

this.filterForm = new FormGroup({ 
    title: new FormControl('', Validators.required) 
});