从角度2打字稿中的复选框获取值

我正在使用Angular 2打字稿。我面临一个问题，我需要提交一个包含复选框的表单。我需要复选框属性中的值。复选框是动态的，所以任何数量的复选框都会在那里。从角度2打字稿中的复选框获取值

<div class="checkbox" *ngFor="#label of labelList"> 
     <div class="col-sm-4"> 
      <label><input type="checkbox" value="{{label.Id}}">{{ label.Name }} </label> 
     </div> 
</div>

来源

2016-04-14 James

我认为这应该工作（未测试）

<div class="checkbox" *ngFor="let label of labelList"> 
    <div class="col-sm-4"> 
    <label> 
     <input type="checkbox" value="{{label.Id}}" (change)="checkboxes[$event.target.getAttribute('value')]=$event.target.checked"> 
     {{ label.Name }}</label> 
    </div> 
</div>

，并在组件改变复选框的值存储在checkboxes。

来源

2016-04-14 05:09:39

什么将在打字稿（角2）方面。会有什么功能？ – James

没有功能，只是一个包含已更改复选框值的对象“复选框”。如果您提供更多关于您实际尝试完成的信息，我可能会提出更多建议。 –

控制台的复选框的值？ – James

您必须指定name属性才能在后端追踪复选框。

来源

2016-04-14 09:04:22 kemsky

我用这个复选框： ng2-material checkbox

而且你可以在你的组件做到这一点：

<md-checkbox [checked]="exists(label.Id)" (click)="toggle(label.Id)"></md-checkbox> 

    selected = []; 
    @Output() selectedChange:EventEmitter<any> = new EventEmitter(); 

    toggle(id) { 
    var index = this.selected.indexOf(id); 
    if (index === -1) this.selected.push(id); 
    else this.selected.splice(index, 1); 
    this.selectedChange.emit(this.selected); 
    } 

    exists(id) { 
    return this.selected.indexOf(id) > -1; 
    }

来源

2016-04-14 10:35:41 alexalexandresq

-4

我想你想知道选中的复选框或没有，你可以很容易地获得通过为输入标签属性指定ng-model属性来指定布尔值的形式。

<md-checkbox ng-model="ctrl.someBooleanValue"></md-checkbox>

来源

2016-04-14 12:46:07 Ajay

该问题需要Angular 2的帮助; “ng-model”是Angular 1语法。 – ansorensen

输入

<input type="checkbox" (change)="selectionChange($event.srcElement, dataItem)">

更改事件

selectionChange(input: HTMLInputElement) { 
    input.checked === true 
     ? doSomethingIfTrue() 
     : doSomethingIfFalse(); 
}

来源

2017-07-10 18:46:38 Dblock247

enter code here

submitForm(form:NgForm){ 
 
console.log(form.value); 
 
}

<div class="checkbox" *ngFor="#label of labelList"> 
 
     <div class="col-sm-4"> 
 
      <label><input type="checkbox" name='label{{label.Id}}' value="{{label.Id}}">{{ label.Name }} </label> 
 
     </div> 
 
</div>

使用name属性，包括label.id，所以你会得到在阵列形式的所有价值。

预计这将帮助。

来源

2017-08-26 05:17:59

从角度2打字稿中的复选框获取值

回答

相关问题