使用自动完成过滤对象内的数组答案

【问题标题】：Filter Array within object using autocomplete使用自动完成过滤对象内的数组
【发布时间】：2017-08-11 08:41:01
【问题描述】：

我正在尝试使用两种过滤方法根据字符串过滤对象内的数组。这是我的对象的样子。

[
  {
    "cat": "Accommodation and Food Service Activities",
    "value": [
      {
        "sic": "55",
        "desc": "Accommodation"
      },
      {
       "sic": "56",
        "desc": "Food and beverage service activities"
      }
    ]
  },
  {
    "cat": "Activities Of Extraterritorial Organisations and Bodies",
    "value": [
      {
       "sic": "99",
        "desc": "Activities of extraterritorial organisations and bodies"
      }
    ]
  }
]

我正在尝试过滤 value.desc 并返回 cat

这是我目前所拥有的

filteredIndustries(industry: string) {
    if (industry) {
      return this.industries.filter(sector => {
        if (sector.value) {
          sector.value.findIndex( v => {
            return v.desc.toString().toLowerCase().indexOf(industry.toString().toLowerCase()) === 0;
          });
        }
      });
    } else {
      return this.industries;
    }

这是我的html，

 <md-input-container>
      <input mdInput placeholder="Industry" [mdAutocomplete]="auto" [formControl]="industryCtrl">
    </md-input-container>

    <md-autocomplete #auto="mdAutocomplete" [displayWith]="displayIndustry.bind(this)">
      <md-option *ngFor="let industry of filteredIndustry | async" [value]="industry">
        {{ industry.cat }}
      </md-option>
    </md-autocomplete>

所以当我输入食物时，它应该过滤 value.desc 并返回 cat 应该是 Accommodation and Food Service Activities

但即使我的返回结果为真，我也没有得到任何返回值。

任何帮助将不胜感激。

【问题讨论】：

欢迎来到 SO！这是一个很好的第一个问题，您发布了代码并正确解释了您的问题，从而很容易为您提供帮助。 +1

标签： javascript arrays angular typescript

【解决方案1】：

你的filter回调函数错过了一个return语句，如果findIndex返回的值大于-1你应该返回true；

filteredIndustries(industry: string) {
    if (industry) {
      return this.industries.filter(sector => {
        if (sector.value) {
          return -1 < sector.value.findIndex( v => { //HERE
            return v.desc.toString().toLowerCase().indexOf(industry.toString().toLowerCase()) === 0;
          });
        }
      });
    } else {
      return this.industries;
    }
}

【讨论】：

只是你传递给 filter() 的函数总是返回 undefined 并且它是一个“假”值，所以它过滤掉了数组 this.industries 的所有元素
感谢您的帮助，这帮助我让它正常工作。

【解决方案2】：

您可以使用some() 代替findIndex()。 indexOf 如果未找到指定的字符串，则返回 -1。

var industries = [
  {
    "cat": "Accommodation and Food Service Activities",
    "value": [
      {
        "sic": "55",
        "desc": "Accommodation"
      },
      {
       "sic": "56",
        "desc": "Food and beverage service activities"
      }
    ]
  },
  {
    "cat": "Activities Of Extraterritorial Organisations and Bodies",
    "value": [
      {
       "sic": "99",
        "desc": "Activities of extraterritorial organisations and bodies"
      }
    ]
  }
] 

var industry = 'food'
var b = industries.filter(sector => {
  if (sector.value) {
    return sector.value.some( v => v.desc.toLowerCase().indexOf(industry) >= 0 );
  } else {
    return industries
  }
});

console.log(b)

【讨论】：

不幸的是，这没有返回值。不管怎么说，还是要谢谢你。整理好了
我已编辑我的答案以证明我的代码有效。