如何實現在角度4中自動保存反應形式？

Question

我想在表單有效時自動保存反應形式的內容，而不點擊保存按鈕。

Answer 1

您將希望訂閱FormGroup的statusChanges()方法，並且在該Observable中，您可以確定FormGroup是否有效，然後觸發保存事件。

import 'rxjs/add/operator/takeWhile'; 
import { FormBuilder, FormGroup } from '@angular/forms'; 

@Component({...}) 
export class MyComponent { 

    private form: FormGroup; 
    private alive: boolean; 

    constructor(private formBuilder: FormBuilder) {} 

    public ngOnInit(): void { 
    this.alive = true; 
    this.form = this.formBuilder.group({ 
     // your form configuration 
    }); 

    this.form.statusChanges() 
     .takeWhile(this.alive) // only subscribe while this component is alive 
     .subscribe((status) => { 
     // if status is valid, auto-save 
     }); 
    } 

    public void ngOnDestroy() { 
    this.alive = false; 
    } 
} 

Answer 2

不要忘記在最後取消訂閱。您應該捕獲您的訂閱，並在最後取消訂閱。以避免任何內存泄漏。

import { Subscription } from 'rxjs/subscription'; 
@Component({...}) 
export class MyComponent { 
... 
subscription = new Subscription; 
... 

ngOnInit() { 
    this.subscription.add(this.form.statusChanges() 
    .takeWhile(this.alive) 
    .subscribe(status => { 
    //do whatever 
    }); 

ngOnDestroy() { 
    this.subscription.unsubscribe(); 
}