javascript - Angular2取消订阅formGroup上的valueChanges

Question

我对表单上的退订值更改有疑问，我用它来进行实时验证。我想在精确情况下关闭的方法:

this.taskForm.valueChanges.subscribe(data => {
                       ...
                this.output = data;
        });

我想在提交后删除这个监听器。我怎样才能做到这一点？我尝试使用 unsubscribe 但它没有帮助。以下是我的尝试:

this.sub = this.taskCreate.valueChanges.subscribe(data => {
                          ...
                this.output = data;
        });

我尝试添加 this.sub.unsubscribe();，但没有帮助。

onSubmit(form: FormGroup) {
    let context: number = 0;

    if(form.valid) {
        this.appService.addTask(form.value)
            .then(result => {
                this.lgModal.hide();
                this.taskCreate.reset({ priority: '' });
                this.cartBox.cart = [];
                this.cartBox.showCart = false;
                this.createTaskDone.emit();
                this.attachments.attachmentList = [];
                this.uploader.clearQueue();
                this.reloadContent.emit(context);   
                this.counter += 1;  
                console.log("COUNTER: ", this.counter);

            })} 
    else {
        this.formValidator(form);

    }

}

formValidator(form:FormGroup) {
    if(!form.controls['goal'].valid) this.formValid.goalErr = 1; else this.formValid.goalErr = 0;
    if(!form.controls['priority'].valid) this.formValid.priorityErr = 1; else this.formValid.priorityErr = 0;
    if(!form.controls['note'].valid) this.formValid.noteErr = 1; else this.formValid.noteErr = 0;

    this.taskCreate.valueChanges.subscribe(data => {
        this.formValidator(form);
        this.output = data;
    });
}

Answer 1

在 formValidator 中订阅 valueChanges 对我来说似乎是错误的

formValidator(form:FormGroup) {
    if(!form.controls['goal'].valid) this.formValid.goalErr = 1; else this.formValid.goalErr = 0;
    if(!form.controls['priority'].valid) this.formValid.priorityErr = 1; else this.formValid.priorityErr = 0;
    if(!form.controls['note'].valid) this.formValid.noteErr = 1; else this.formValid.noteErr = 0;

    this.taskCreate.valueChanges.subscribe(data => {
        this.formValidator(form);
        this.output = data;
    });
}

我假设你真正想要的是移动

this.sub = this.taskCreate.valueChanges.subscribe(data => {
    this.formValidator(form);
    this.output = data;
});

在初始化 this.taskCreate 的代码下面，然后在 onSubmit 中执行 this.sub.unsubscribe() 调用。

我假设你的问题是 this.taskCreate.valueChanges.subscribe( 被多次调用，如果你使用 this.sub = this.taskCreate.valueChanges.subscribe( 以前的订阅将被新订阅覆盖，并且不能取消订阅，因为引用丢失。