Question

我正在使用angular的Select2组件作为多重选择器。我需要一个选项来通过单击按钮或复选框来选择所有元素。 https://www.npmjs.com/package/ng-select2

当按钮被按下时，我尝试在数组[[ngModel）] =“ value”中插入所有元素的ID，但没有用

.HTML代码

<ng-select2 [data]="exampleData"
            [options]="options"
            [width]="200"
            [(ngModel)]="value"
            (valueChanged)="onTagChanged($event)">
</ng-select2>
<button (click)='selectAll()'>Select all</button>

.TS代码

ngOnInit() {
    this.exampleData = [
      {
        id: '0',
        text: 'Pau Cano Dominguez',
      },
      {
        id: '2',
        text: 'Miguel Ángel Vargas Gomez'
      },
      { id: '3',
        text: 'Pedro Medina Cruz'
      },
      { id: '4',
        text: 'Oriol Fuentes Nuñez'
      },
      {
        id: '5',
        text: 'Rayan Mora Sanchez'
      }
    ];
    this.options = {
      width: '200',
      multiple: true,
      tags: false
    };
}
selectAll() {
    console.log('Select All Pushed');
    this.value.push('0');
    this.value.push('1');
    this.value.push('2');
    this.value.push('3');
    this.value.push('4');
}

Answer 1

ng-select2组件正在使用OnPush更改检测策略。这意味着它仅在检测到输入已更新时才会更新自身。

您可以在ng-select2 component code at line 31

中看到它

现在通过引用传递数组，这就是组件未检测到任何更改的原因。您需要做的是传递一个新数组。因此，请在您的 selectAll 函数中执行以下操作：

this.value = ['0', '1', '2', '3', '4']; // this passes a new array reference

要了解有关更改检测here's a good read

的更多信息

如何通过按下按钮选择所有select2元素？

1 个答案: