Question

我可能正在监督某些事情，但是我陷入了困境，当在promise中更新以下变量时，以下变量似乎在模板中未更新：

private emailDetected: boolean = false;
private detectedEmail: string = "";

detectEmailViaPassword() {
    this.afAuth.auth.signInWithPopup(new auth.GoogleAuthProvider()).then(authResult => {
        this.detectedEmail = authResult.user.email;
        this.emailDetected = true;
    }).catch(error => {
        console.log(error);
    });
}

记录变量时，似乎它们已更新，但是模板中什么也没有发生。当我从firebase auth promise以外的其他地方更新变量时，它可以正常工作-我非常困惑...

在模板中正确引用了变量：{{detectedEmail}}

非常感谢您的帮助：）

Answer 1

您好，对变量的访问是私有的，如果您想直接从模板访问，则必须更改为public，否则，您将需要使用函数或模板中的public返回。

Answer 2

（假设.signInWithPopup是网络请求或其他异步调用）

响应于与组件的使用交互而运行角度变化检测。如果在事件处理之外更新了值，则需要手动告诉组件它已更改。

constructor(private changeDetector: ChangeDetectorRef){}

detectEmailViaPassword() {
    this.afAuth.auth.signInWithPopup(new auth.GoogleAuthProvider()).then(authResult => {
        this.detectedEmail = authResult.user.email;
        this.emailDetected = true;
        this.changeDetector.markForCheck();
    }).catch(error => {
        console.log(error);
    });
}

更多深度阅读：https://blog.thoughtram.io/angular/2016/02/22/angular-2-change-detection-explained.html

解决public与private评论：

这些类型描述符是TypeScript语言构造。将TypeScript编译为JavaScript后，它们与应用程序的功能无关。 TypeScript编译器只能检测来自其他TypeScript的访问错误-对模板的访问（实际上）是不受限制的。

其他讨论："private" and "public" in Angular 2 component

为什么变量不更新？

2 个答案: