Question

我是Angulare4的新手，我想从列表中排除元素，因为它们已经包含在数组中。

我们说我有一个userItems数组。用户可以从列表中添加项目，但是在项目的当前状态下，如果他选择了他已经拥有的项目，则会显示错误消息。

更简单且用户友好的方式是仅显示他不拥有的元素。

这就是我目前正在使用的内容：

<option *ngFor="let userItem of userItems" value="{{ userItem.id }}">
{{ userItem.name }}
</option>

我如何过滤结果？我想过使用烟斗

Answer 1

如果我理解你想要的正确，你可以只看到输入的值并从列表中有条件地删除它。

您可以使用代码中的option input语法将#input分配给视图中的本地变量。然后从那里，您可以将*ngIf指令应用于菜单项，以将它们与当前值进行比较。并清除与当前值匹配的那个。

例如：

<option #input *ngFor="let userItem of userItems" value="{{ userItem.id }}">
    <ng-container *ngIf="userItem.id !== input.value">
        {{ userItem.name }}
    </ng-container>
</option>

Answer 2

我的建议是使用ng-template：

<option *ngFor="let userItem of userItems" value="{{ userItem.id }}">
  <ng-template [ngIf]="some-condition">
    {{ userItem.name }}
 </ng-template>
</option>

另一种方法是在用户插入新值时使用阵列上的filter过滤组件中的数组。

userItems.filter(value => value !== 3);

我也许并不完全理解你的问题。如果不是Plese更具体。

Angular4：排除数组

2 个答案: