Angular 7设置选定值不触发更改事件

问题描述 投票:0回答:2

我有一个选择下拉菜单和多选下拉菜单。两者都具有动态价值。

我正在做的是我点击编辑按钮它显示模态内部模态有模块的选择下拉菜单和多选动作。

我动态选择模块名称它完美地工作但依赖多选不起作用。我认为单选不会触发改变事件。

HTML:

<div class="col-md-12">
    <label for="module">Select Module</label>
    <select class="form-control" (change)="onChangeModuleDD($event)" name="moduleSelection" required>
    <option value="">-- Select Module --</option>
    <option *ngFor="let module of allModuleData" [value]="module | json" [selected]="module.name == usermodule">{{
        module.name
        }}</option>
    </select>
</div>

<div class="col-md-12">
    <label for="actions">Select Actions/Charts</label>
    <ng-multiselect-dropdown [placeholder]="'-- Select Action/Charts --'" [data]="dropdownList" [settings]="dropdownSettings"
        (onSelect)="onItemSelect($event)" name="actionSelection" (onDeSelect)="OnItemDeSelect($event)"
        (onSelectAll)="onSelectAll($event)" (onDeSelectAll)="onDeSelectAll($event)">
    </ng-multiselect-dropdown>
</div>

零件:

onChangeModuleDD(event) {
    this.selectedItems = [] // empty selected action array
    this.dropdownList = []
    let value = event.target.value

    if (value) {
      let parsedValue = JSON.parse(value)
      this.usermodule = parsedValue.name

      if (parsedValue.hasCRUD == 0) {
        this.userListingApi.fetchAllDashboardAction().subscribe(res => {
          this.dropdownList = []
          for (let i = 0; i < res['data'].length; i++) {
            this.dropdownList.push(res['data'][i])
          }
        })
      } else {
        this.userListingApi.fetchAllCRUDAction().subscribe(res => {
          this.dropdownList = []
          for (let i = 0; i < res['data'].length; i++) {
            this.dropdownList.push(res['data'][i])
          }
        })
      }
    } else {
      console.log('Nothing to display')
    }
  }

在插入时它完美地工作但是当我动态选择时它不起作用。

编辑:

onItemSelect(item: any) {
    this.selectedItems.push(item)
}

OnItemDeSelect(items: any) {
    var id = items._id
    this.selectedItems = this.selectedItems.filter((item) => item['_id'] !== id);
  }

onDeSelectAll(items: any) {
    this.selectedItems = items
  }
angular7
2个回答
0
投票

在你的组件中我看不到onItemSelect($ event),OnItemDeSelect($ event)和其他多选方法绑定到该事件。

检查此链接:https://www.npmjs.com/package/ng-multiselect-dropdown

在组件中添加此项并尝试:

 onItemSelect(item: any) {
 console.log(item);
 }

0
投票

不确定它是否应该起作用。请看这个问题:https://github.com/NileshPatel17/ng-multiselect-dropdown/issues/5

重新加载[data]后可能会删除事件(请参阅我的评论)。

© www.soinside.com 2019 - 2024. All rights reserved.