里面asyncPipe方法运行多次(Method inside asyncPipe runs mul

我使用asyncPipe带有*ngIf装饰，可自动订阅/取消订阅到可观察一个返回object的内<ng-container>...</ng-container> 。

到目前为止好，但里面ng-container标签，我想通过object作为参数的方法doSomething(object) 。

问题是，该方法运行的5-8倍？

HTML模板

<ng-container *ngIf="(user$ | async) as user">
   {{  doSomething(user) }} <-- method executes multiple times
</ng-container

打字稿文件

class Component implements OnInit { 

    user: Observable<User>; 

    constructor() {}

    ngOnInit() {
        this.user$ = this.userService.getUser(id);
    }

    checkConfigs(object) {
        console.log(object);
    }
}

我测试过，如果这个问题是执行多次的观察的，但它运行一次。然后以为内的代码ng-container是问题，但也运行一次。

现在的问题是不同的这是因为我不想问其是否可取，但如何解决这一问题。在实践中，这应该工作。但由于Angulars changeDetection架构，它并不如预期的观测量工作，其甚至在这篇文章中指出的东西，你不知道的AsyncPipe如何使用来解决它changeDetection: ChangeDetectionStrategy.OnPush 。

您可以将组件changeDetectionStrategy改为onPush。在这之后，你的DoSomething的功能不调用几次。所以基本上它调用只要检测到变化的功能，所以这就是为什么它被多次调用，因此更改检测技术后，不会发生

尝试这个：

在您的组件：

class Component implements OnInit { 
@Component({
   selector: 'app-root',
   templateUrl: './app.component.html',
   styleUrls: ['./app.component.css'],
   changeDetection: ChangeDetectionStrategy.OnPush // this line
 })
}