有没有一种角度选择方式，当我搜索文本，但显示AngularJs中的图标选项？

Question

例如，我有元素的列表类似以下内容：

[{ 
    id: 1, 
    name: 'The only planet with life that currently found', 
    icon: 'base64-blablalbla', 
    abbr: 'Earth' 
}, { 
    id: 2, 
    name: 'Another string that describes M*a*r*s', 
    icon: 'base64-blablalbla', 
    abbr: 'Mars' 
}, { 
    id: 3, 
    name: 'Another string that describes M*o*o*n', 
    icon: 'base64-blablalbla', 
    abbr: 'Moon' 
}] 

我想用选择插件，当我搜索“AR”的“简称”场（撞击地球和火星）的选择，显示他们的图标将被显示。与一般行为不同，搜索“名称”字段，显示“名称”字段，我的要求是搜索“abbr”字段，但显示“图标”字段，或显示名称+图标或我可以自定义它做最好的。

select2或任何其他插件也是受欢迎的。

任何人都可以帮助我吗？提前致谢。

Answer 1

你可以做到这一点丝毫一个CustomPipe：

<div *ngFor="let item of items | yourCustomPipe:'id,text':query"> 
    <i [ngClass]="item.icon"></i> 
</div> 

但要carreful，Pipe can slow your app

左右，然后，你有一个custom Pipe which will filter your items。