从对象数组中过滤值

Question

我正在研究自动完成 angular material 2 功能。这是他们网站提供的工作插件：https://plnkr.co/edit/7Q0zVT68CSPz4wGhFbPo?p=preview

他们正在从状态数组中过滤状态。这是他们的过滤器实现：

filterStates(val: string) {
    return val ? this.states.filter(s => new RegExp(`^${val}`, 'gi').test(s))
               : this.states;
  }

目前他们过滤的是这样一个数组：

states = [
    'Alabama',
    'Alaska',
    'Arizona',
    'Arkansas',
    'California',

'Colorado' }

但是，如果它不是一个简单的数组而是一个对象数组，如：

states=[{"name":"Alaska",code:1234},
{"name":"Bulgaria",code:12345},
{"name":"Colarado",code:12346},
{"name":"New Jersey",code:12347},
]

到目前为止我尝试过的是：

filterStates(val: string) {
    return val ? this.stateFilter(val)
               : this.states;
  }
statefilteredvalue:string;
  statefilter(val):string{
        for(var i=0; i< this.states.length;i++){
            console.log(this.states[i].name);
           this.statefilteredvalue= this.states[i].name.filter(s => new RegExp(`^${val}`, 'gi').test(s))
        }
        return this.statefilteredvalue;
  }

但是我没有得到想要的输出。

如何根据上述数组中的name过滤它？

Answer 1

您需要对原始过滤器进行的唯一更改是更改它将根据您对象的名称属性测试正则表达式，因此您的 filterStates 应如下所示：

filterStates(val: string) {
  console.log(val)
    return val ? this.states.filter(s => new RegExp(`^${val}`, 'gi').test(s.name))
               : this.states;
}

更新：您还需要将[value]="state"更改为[value]="state.name"

从对象数组中过滤值

Filter values from an array of object

angular-material2

angular

Plunker