PrimeNG中的多选显示空值的多选

Question

我有一个多选组件：

<p-multiSelect class="multiple-select" display="chip" [options]="allTags" name="selectedTags" [(ngModel)]="selectedTags" optionLabel="tag" optionValue="tag"></p-multiSelect>

allTags数组中的单个标记：

{ tag: 'someTag' }

selectedTags数组包含字符串。当添加标签时，它可以完美地工作。当我想要预先选择一些标签时，问题就出现了。

  preselectTags(tags: string[]) {
    tags.map(x => this.selectedTags.push(x));

  }

我尝试过forEach，并且简单地重新赋值，而不是array.map，但每次我都会看到类似这样的结果：

​

​

填充selectedTags后，Console.logging将返回一个正确字符串数组。我做错了什么？

PS。谢谢你的预支。

Answer 1

如果我没记错，我认为selectedTags数组应该与allTags具有相同的结构，因此，当您进行推送时，您必须构建该结构。

preselectTags(tags: string[]) {
   tags.map(x => this.selectedTags.push({val:x}));
}

希望对你有帮助，如果没有，请给出每个数组结构的打印。问候

Answer 2

您需要查找选项，以便过滤掉不需要的项目/选择标签。

因此，根据标记数组的内容，您可以循环遍历它们，或者尝试：

preselectTags(tags: string[]) {

  this.selectedTags = tags.map(x => this.allTags.find(y => y.val === x.val));
}

帮助处理上述数组的结构会更容易……