【问题标题】:Events not firing within checkboxes in Angular2事件未在 Angular2 中的复选框内触发
【发布时间】:2016-05-17 10:56:50
【问题描述】:

我已经尝试了所有我能想到的方法来在复选框更改状态时触发事件,但我似乎无法让它工作。

这里是 html

<div *ngIf="role?.ACTIVE_FLAG === 'Y'">
   <div class="label"> Active Record </div>
      <input type="checkbox" (click)="toggleRoleActive()" checked>
</div>
<div *ngIf="role?.ACTIVE_FLAG === 'N'">
   <div class="label"> Active Record </div>
      <input type="checkbox" (click)="toggleRoleActive()">
</div>

这里是 toggleRoleActive()
编辑:

toggleRoleActive(){
    if(this.role_submit.ACTIVE_FLAG === 'Y'){
        this.role_submit.ACTIVE_FLAG = 'N';
    }else {
        this.role_submit.ACTIVE_FLAG = 'Y';
    }
}

我面临的一个挑战是,当我从服务器获取数据时,需要检查或不检查按钮。但如果他们想停用或重新激活该角色,我希望它响应复选框。

我尝试过使用[(ngModel)](change) 和更简单的解决方案,但唯一触发任何事件的是[(ngModel)],但这样做我最终得到true/@987654327 @ 而不是 'Y'/'N'。此外,如果我使用[(ngModel)],则无论我的服务器发送什么数据,该复选框都会始终标记为选中状态。

【问题讨论】:

    标签: angular angular2-template angular2-forms


    【解决方案1】:

    我一直在处理这样的复选框

    <input #myId type="checkbox" (change)="myProp = myId.checked" />
    

    组件定义了myProp 属性

    这里有更多信息+演示http://www.syntaxsuccess.com/viewarticle/input-controls-in-angular-2.0

    【讨论】:

    • 是的,我之前在那个网站上试过!它不适合我。不过再次感谢您的参考!
    • 我的愚蠢错误。我正在使用
    【解决方案2】:

    您可以分别处理分配和更改事件处理程序:

    <input type="checkbox" 
      [ngModel]="role?.ACTIVE_FLAG === 'Y' ? true : false"        
      (ngModelChange)="toggleRoleActive()" checked>
    

    【讨论】:

    • 非常感谢!你甚至让我的代码更简洁!我以后必须记住(ngModelChange)。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 2015-08-09
    • 2011-11-17
    • 2016-04-13
    • 1970-01-01
    • 2023-04-02
    • 2019-04-13
    • 1970-01-01
    相关资源
    最近更新 更多