Question

我的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 个答案: