Angular 5 ERROR TypeError：无法读取未定义的属性“toLowerCase”答案

【问题标题】：Angular 5 ERROR TypeError: Cannot read property 'toLowerCase' of undefinedAngular 5 ERROR TypeError：无法读取未定义的属性“toLowerCase”
【发布时间】：2018-11-30 09:23:53
【问题描述】：

我的 chrome 控制台出现此错误：

错误类型错误：无法读取属性 'toLowerCase' 未定义

在 DashboardComponent.html:5 上：

<div class="mdl-grid center-items">
  <div class="mdl-cell mdl-cell--4-col">
      <mat-form-field class="search-form-field">
          <input matInput type="text" name="searchCompany" placeholder="Search" [(ngModel)]="searchCompany"/>
          <button *ngIf="searchCompany" matSuffix mat-icon-button aria-label="Clear" (click)="searchCompany=''">
            <mat-icon>close</mat-icon>
          </button>
      </mat-form-field>
  </div>
</div>

这是我的 CompanyFilterPipe 类：

import { PipeTransform, Pipe } from "@angular/core";
import { Company } from "../../models/company.model";

@Pipe({
    name : 'companyFilter'
})
export class CompanyFilterPipe implements PipeTransform{
    transform(companies:Company[], searchCompany:String) : Company[]{
        const value = searchCompany.toLowerCase();
        if(!companies == !searchCompany){
            return companies;
        }
        return companies.filter(companies => companies.perusahaan.toLowerCase().indexOf(value) !== -1);
    }

}

我已经在 app.module.ts 上声明了 CompanyFilterPipe，但它不能正常工作，我该如何解决这个问题？谢谢。

【问题讨论】：

但是您没有在模板中的任何地方使用companyFilter ？
我只在这个页面使用。
使用 if 来考虑 searchCompany 不为空： if (searchCompany){...}else{return []} //返回一个空数组

标签： node.js angular mean

【解决方案1】：

看起来perusahaan 属性在company 对象上未定义。尝试在Company 类型中声明它，或者在函数声明中使用companies:any[]。此外，您应该在过滤器中使用不同的变量名称。

编辑

1) 使用searchCompanies:string 代替字符串

2) !companies == !searchCompany 将始终为真，除非其中任何一个字段为空，因此无法达到您的较低返回语句。

3) 使用companies.filter(companies =>.. 会发生冲突，因为您为数组和过滤器组件提供相同的名称。像这样使用它：source.pipe(filter(num => num > 5))

4) 检查 searchCompany 是否为空。

【讨论】：

我已经定义好了，我用它来给公司起名字。
尝试使用任何[] 声明或 console.log Companies.perusahaan 来查看实际传递的内容。
我创建了导出类 Company{ perusahaan : String;} 但是当我检查 company.perusahaan 时它返回未定义。为什么会这样？
但随后我在 console.log(companies) 中返回了我在数组内的对象中的数据。
我发现问题出在回报公司；但为什么？当我删除退货公司时，过滤器正在工作，但我的控制台上仍然出现错误。

【解决方案2】：

管道的声明没有错。管道被触发，这就是为什么您会收到与管道内写入的逻辑相关的错误。

toLowerCase() 方法应该只应用于字符串。

正如错误所说，无法读取未定义的属性“toLowerCase”，您需要验证发送到管道的输入。 toLowerCase() 应用于两个属性“searchCompany”和“companies.perusahaan”，请在管道中放置一个调试器并验证这两个属性的值都是字符串。

【讨论】：

当我检查console.log中的值时，它返回输入我在输入中输入的内容。
你的意思是searchCompany的值？
是的，searchCompany 的值。

【解决方案3】：

通过添加解决：

if(!searchCompany){
    return companies;
}

所以当搜索输入为空时，我返回公司，但是当输入有值时，它会

return companies.filter(companies => companies.perusahaan.toLowerCase().indexOf(value) !== -1);

感谢你帮助我善良的人:)

【讨论】：