在Angular 8中,如果你的主题不能对过滤后的数据作出反应,可能是因为Angular的变更检测机制没有正确触发。你可以尝试以下解决方法:
在组件的构造函数中注入ChangeDetectorRef,并在过滤数据的地方调用detectChanges()
方法来手动触发变更检测机制。
import { Component, ChangeDetectorRef } from '@angular/core';
@Component({
selector: 'app-your-component',
template: `
- {{ item }}
`
})
export class YourComponent {
items: string[] = ['item1', 'item2', 'item3'];
filteredItems: string[] = [];
constructor(private cdr: ChangeDetectorRef) {}
filterData(keyword: string) {
this.filteredItems = this.items.filter(item => item.includes(keyword));
this.cdr.detectChanges(); // 手动触发变更检测
}
}
确保在过滤数据时,使用不可变对象来更新数据,这样Angular才能正确检测到数据的变化。
import { Component } from '@angular/core';
@Component({
selector: 'app-your-component',
template: `
- {{ item }}
`
})
export class YourComponent {
items: string[] = ['item1', 'item2', 'item3'];
filteredItems: string[] = [];
filterData(keyword: string) {
this.filteredItems = this.items.filter(item => item.includes(keyword));
this.filteredItems = [...this.filteredItems]; // 使用不可变对象来更新数据
}
}
通过使用不可变对象,每当过滤数据时,都会创建一个新的数组实例,从而触发Angular的变更检测机制。
希望这些解决方法能够帮助你解决在Angular 8中主题无法对过滤后的数据作出反应的问题。