Question

我想根据其类型在md-chip上方创建一个标签，但是具有类似类型的对象应分组在一个标签下，如下所示：

<span> Orange item: </span>
<md-chip> Carrot </md-chip>

Red item:
Red apple
Strawberry

Yellow item:
Banana

<span> Orange item: </span>
<md-chip> Tomato </md-chip>

我很抱歉不能嵌入图像来显示自己的需求，而只能以文本形式显示。

这是我尝试过的：

<span>Orange object:</span>
<md-chips ng-model="arrayList | filter: {type: 'orange'}"
          md-removable="true">
    <md-chip-template>
        {{$chip.name}}
    </md-chip-template>
</md-chips>

<span>Red object:</span>
<md-chips ng-model="arrayList | filter: {type: 'red'}">
    <md-chip-template>
        {{$chip.name}}
    </md-chip-template>
</md-chips>

<span>Yellow object:</span>
<md-chips ng-model="arrayList | filter: {type: 'yellow'}">
    <md-chip-template>
        {{$chip.name}}
    </md-chip-template>
</md-chips>

但是，这将导致如下的错误：

angular.js：13550 Error: [ngModel:nonassign]表达式'arrayList | 过滤器：{type：'orange'}'是不可分配的。元素：

我还有其他方法可以实现相同目标吗？

[更新] 假设有第二个Orange项，则应在最后一个Yellow项的正下方创建一个用于第二个Orange项的新标签和md-chip。已更新示例代码。

如何在md芯片中的每个md芯片上方添加标签？

0 个答案: