如何在不出现递归错误的情况下监听可观察的内容

时间:2019-06-20 10:38:07

标签: angular recursion

我的Angular应用程序有一个Angular FormControl,其中包含2个单选按钮。

我想根据所选值(即用户选择哪个单选按钮)设置一个布尔值。

这是我的表格:

<form [formGroup]="roleForm">
    <div class="form-group">
        <label for="role">Role:</label>
        <label class="radio-inline">
        <input type="radio" value="employee" formControlName="role">Employee
        </label>
        <label class="radio-inline">
        <input type="radio" value="manager" formControlName="role">Manager
        </label>
    </div>
</form>

这是我的打字稿:

ngOnInit() {
    this.roleForm = this.fb.group({
        role: ['employee']
    });

    this.roleForm.get('role').valueChanges.subscribe((role: string) => {
        this.onRoleChange(role);
    });
}

onRoleChange(role: string) {
    if (role === 'employee') {
        this.rdoEmployeeSelected = true;
        console.log('ROLE: ' + role);
        this.onRoleChange(role);
    } else {
        this.rdoEmployeeSelected = false;
        console.log('ROLE: ' + role);
    }
}

编译项目时,没有任何错误,并且默认情况下选择了employee。另外,当我选择Manager时,它也可以正常登录到控制台。

但是,如果我重新选择employee,则员工被登录到控制台数千次,最终我得到以下错误:

  

InternalError:过多的递归

有人可以告诉我如何根据选择的单选按钮更新rdoEmployeeSelected布尔值,而不会导致应用程序崩溃吗?

0 个答案:

没有答案