Question

在我的组件的ngOnInit中，我定义了一个反应形式组（在另一个表单组中，但这不相关）。

对于其中一个输入控制器，我想在发生更改时进行相应的观察和操作，因此我设置了valueChanges.subscribe并按预期执行。

但是，我无法在事件的回调中找到此组件全局变量。

const company = this.formBuilder.group({
    name: ['', Validators.required]
});

company.controls['name'].valueChanges.subscribe(value => {
    //All `this` here are  undefined
    if (/\s/.test(value)) this.spaceEntered = true;
    else if (value && value.replace(/\s/g, "").length > 0)
        this.stringEntered = true;
});

为什么会发生这种情况，我该如何解决这个问题？

Answer 1

我很惭愧承认，但这种情况与Angular 2无关，但我忘记了Javascript中的上下文。

只需将事件处理程序代码 放在组件范围内的函数中 即可解决此问题：

export class ProductComponent implements OnInit {

    companyFG: FormGroup;
    spaceEntered: boolean;
    stringEntered: boolean;
    .
    .
    ngOnInit() {
        this.companyFG = this.formBuilder.group({
            name: ['', Validators.required]
        });
        .
        .
        this.companyFG.controls['name'].valueChanges.subscribe(value => this.filterCompany(value));
        .
        .
        .
    }

    filterCompany(term: string) {
        if (/\s/.test(term)) this.spaceEntered = true;
        else if (term && term.replace(/\s/g, "").length > 0)
            this.stringEntered = true;
    }

}

在Reactive Form控制器valueChanges事件中未定义Angular 2 Component全局变量

1 个答案: