我正在学习Angular的变更检测,但无法找到答案,为什么以下代码段不起作用。
假设我们设置了@if($product->currentUserHasSubmittedReview() == false)
<!-- REVIEW CODE -->
@endif
Component
:
ChangeDetectionStrategy.OnPush
这是StackBlitz。
当API请求以错误结束时,@Component({
selector: 'material-app',
templateUrl: 'app.component.html',
changeDetection: ChangeDetectionStrategy.OnPush
})
export class AppComponent {
public isBusy: boolean;
public message: any;
public version = VERSION;
constructor(
private readonly httpClient: HttpClient,
private readonly dialog: MatDialog) {
}
public onSeeBugClick(): void {
this.sendApiRequest();
this.dialog.open(DialogComponent, {
width: '250px'
});
}
private sendApiRequest(): void {
this.message = 'Sending request';
this.isBusy = true;
this.httpClient.get<void>('https://jsonplaceholder.typicode.com').pipe(
finalize(() => {
this.isBusy = false;
}))
.subscribe(
(): void => {
console.log('Success from jsonplaceholder.typicode.com');
this.message = 'Success';
},
(error: string): void => {
console.log('Error from jsonplaceholder.typicode.com');
this.message = 'Error '+ error.toString() + ': ' + JSON.stringify(error);
});
}
}
按钮禁用状态都不会更新,下面的消息文本也不会更新。但如果我评论ENABLE ME BACK
行 - 它可以正常工作。
有人可以解释为什么ChangeDetectionStrategy.OnPush
策略在这种情况下不起作用吗?