asyncPipe中的方法多次运行
asyncPipe中的方法多次运行
提问于 2019-03-18 20:29:25
我正在使用带有*ngIf装饰器的asyncPipe，该装饰器可以自动订阅/取消订阅在<ng-container>...</ng-container>中返回object的Observable。
到目前为止一切正常，但是在ng-container标记中，我希望将object作为参数传递给doSomething(object)方法。
问题是这个方法会运行5-8次吗？
HTML模板
<ng-container *ngIf="(user$ | async) as user">
{{ doSomething(user) }} <-- method executes multiple times
</ng-containerTypeScript文件
class Component implements OnInit {
user: Observable<User>;
constructor() {}
ngOnInit() {
this.user$ = this.userService.getUser(id);
}
checkConfigs(object) {
console.log(object);
}
}我已经测试了问题是否是多次执行的可观察对象，但它只运行了一次。然后认为ng-container中的代码是问题所在，但这也只运行一次。
这个问题不同于this，因为我问的不是它是否可取，而是如何解决问题。在实践中，这应该是可行的。但是由于Angulars changeDetection的架构，它并不能像预期的那样工作在可观察的对象上，它甚至在本文中指出了如何使用changeDetection: ChangeDetectionStrategy.OnPush来解决这个问题。
回答 1
Stack Overflow用户
回答已采纳
发布于 2019-03-18 20:39:31
您可以将components changeDetectionStrategy更改为onPush。在此之后，您的doSomething函数不会多次调用。所以基本上只要检测到变化，它就会调用函数，这就是为什么它会多次调用，所以在改变检测技术之后，这种情况就不会发生
试试这个：
在您的组件中：
class Component implements OnInit {
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css'],
changeDetection: ChangeDetectionStrategy.OnPush // this line
})
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/55221435
复制相关文章
相似问题
腾讯云开发者
