Tan*_*Raj 5 angular-ngselect angular-reactive-forms angular6
请通过链接(https://ng-select.github.io/ng-select#/multiselect-checkbox)来了解ng-select多选复选框。
我试图在我的angular 6应用程序中使用ng-select “组选择子项”。
我在使用ng-select “组选择子项”和“反应式表单”而不是模板驱动的表单时遇到问题。
我已经厌倦了
<ng-select
[items]="userGroupsList"
[multiple]="true"
bindLabel="name"
groupBy="gender"
[selectableGroup]="true"
[selectableGroupAsModel]="false"
[closeOnSelect]="false"
bindValue="id"
formControlName="userGroups" placeholder="Select a user group">
<ng-template ng-optgroup-tmp let-item="item" let-item$="item$" let-index="index">
<input id="item-{{index}}" type="checkbox" [(ngModel)]="" formControlName="userGroupParent"/> {{item.gender | uppercase}}
</ng-template>
<ng-template ng-option-tmp let-item="item" let-item$="item$" let-index="index">
<input id="item-{{index}}" type="checkbox" [(ngModel)]="" formControlName="userGroupChild"/> {{item.name}}
</ng-template>
</ng-select>
Run Code Online (Sandbox Code Playgroud)
我已经使用了multiselect-checkbox的相同数据-[items] =“ userGroupsList”
https://github.com/ng-select/ng-select/blob/master/demo/app/shared/data.service.ts-getMockPeople()具有数据
所以在这里我可以在输入中使用[[ngModel)]以及formControlName,如示例中所示,当选择父元素时,如何选择子元素
请帮忙....!
xro*_*t35 13
要使用 formGroup 进行此操作:将 formControlName 保留在将绑定到您的 formGroup 的 ng-select 上。
问题是模板中的那些输入。对我来说,最好的解决方案是像示例中一样继续使用 ngModel。但是您必须让 angular 明白这与 fromGroup 无关,因此您可以在其上单独添加选项。
<input id="item-{{index}}" type="checkbox" [(ngModel)]="item$.selected" [ngModelOptions]="{ standalone : true }" />
Run Code Online (Sandbox Code Playgroud)
没有 ngModel ,还有另一种方法可以做到这一点:
<input id="item-{{index}}" type="checkbox" [checked]="item$.selected" />
Run Code Online (Sandbox Code Playgroud)
| 归档时间: |
|
| 查看次数: |
6063 次 |
| 最近记录: |