Angular2：RadioButton更改事件不具约束

在这里，我想简单地将RadioButton与更改事件绑定。不使用任何库。Angular2：RadioButton更改事件不具约束

以下工作正常。

<input type="radio" name="test" value="A" (change)="onPropertyChange('test')"> 
<input type="radio" name="test" value="B" (change)="onPropertyChange('test')">

但是这个人是不是：

<div class="btn-group col-lg-2" data-toggle="buttons" > 
<label *ngFor=" let app of applications; let i = index; " 
     class="btn btn-default " [ngClass]="{'active':(ticket.app == app)}">  
     <input type="radio" id="app{{i}}" name="app" value="{{i}}"     
      checked="{{ (ticket.app == app) ? 'checked' : ''}}" (change)=" 
      onPropertyChange('app')" > 
    {{app}} 
</label> 
</div>

虽然结合改变事件标记，它给我的老值。

任何人都可以提出正确的方法吗？

在此先感谢... !!!

来源

2016-06-20 Jacks

当你处理你的角不应依赖自举的JavaScript。你的问题是'data-toggle ='buttons'' – yurzui

add onPropertyChange Function ts code – mayur

https://plnkr.co/edit/YMQcwsBW0ems1dyEGJ8G?p=preview – yurzui

使用NG2的自举，

<div class="btn-group col-lg-2"> 
    <label *ngFor="let app of applications" class="btn btn-default" [(ngModel)]="ticket.app" btnRadio="{{app}}">{{app}}</label> 
</div>

在的.ts文件，

新增import { ButtonRadioDirective } from 'ng2-bootstrap/components/buttons';
在@Component注解，通过它directives: [ButtonRadioDirective]。

它工作正常。希望它能为你工作。

来源

2016-06-20 18:40:40 Jacks

具有角2 RC2它不再需要创建RadioButtonState：

单选按钮现在可以共享FormControl例如

<form #f="ngForm"> 
    <input type="radio" name="food" [(ngModel)]="food" value="chicken"> 
    <input type="radio" name="food" [(ngModel)]="food" value="fish"> 
</form>

和：

class MyComp { 
    food = 'fish'; 
}

来源： 5thingsangular - Issue #8

来源

2016-06-20 21:30:24

双向无库绑定：

<div class="btn-group" data-toggle="buttons"> 
    <label class="btn btn-default" [class.active]="yourVariable==item" (click)="yourVariable=item" *ngFor="let item of items"> 
     <input type="radio" style="display: none;" name="radios" [(ngModel)]="yourVariable" [value]="item" [checked]="yourVariable==item" /> 
     {{yourLabelText}} 
    </label> 
</div>

来源

2017-02-01 06:39:10 kravits88

Angular2：RadioButton更改事件不具约束

回答

相关问题