以 ? 命名的对象属性不能在 Angular 中的地图内部工作

Question

我是 Angular 的新手，job.job_company_companyName、the job.job_company.location 和 job.jobTitle，它们都工作/可以基于过滤器进行搜索：但是当我添加带有问号的 Jobs 对象时 (? ) 例如：job.job_details?.jobCountry 和 job.job_details?.jobCity? 它们没有被过滤，除了下面的两行之外，上面的 3 行正在被过滤。你认为我应该怎么做才能让这件事发挥作用？改变什么为什么带问号的属性不能正常工作。有任何想法吗？将不胜感激！

这是我的 search.component.ts

this.filteredList$ = combineLatest(this.list$, this.filter$).pipe(
  map(([jobs, filterString]) =>jobs.filter(job => 
    job.job_company.companyName.toLowerCase().indexOf(filterString.toLowerCase()) !== -1 ||
    job.jobTitle.toLowerCase().indexOf(filterString.toLowerCase()) !== -1 ||
    job.job_company.location.toLowerCase().indexOf(filterString.toLowerCase()) !== -1 ||
    job.job_details?.jobCountry.toLowerCase().indexOf(filterString.toLowerCase()) !== -1 ||
    job.job_details?.jobCity?.toLowerCase().indexOf(filterString.toLowerCase()) !== -1 
    )),
  tap(filtered => {
    this.allJobs = filtered;
    return this.jobsChunk = filtered.slice(0, 9)
  })
);

这里jobs.model.ts

export interface Jobs {
  jobsId: string;
  jobTitle: string;
  job_details?: JobDetails;
  job_package: JobPackage;
  job_status: JobStatus;
  job_company: CompanyProfile;
  createdDate?: string;
}

export interface JobDetails {
  jobCity?: string;
  jobCountry: string;
  jobType: string;
  jobCategory: string;
  jobTags: string[];
  jobDescription: string;
}

export interface CompanyProfile {
  companyName: string;
  location: string; 
}

Answer 1

在这种情况下，您对条件实现有疑问：

job.job_details?.jobCity?.toLowerCase().indexOf(filterString.toLowerCase()) !== -1

如果 job_details 或 jobCity 未定义，则比较将是 undefined !== -1，它将是 true。

一种简单的方法是使用> -1 代替!== -1 条件。

或者检查之前的属性：

job.job_details?.jobCity && job.job_details.jobCity.toLowerCase().indexOf(filterString.toLowerCase()) !== -1