使用 Google 进行身份验证后，模板未更新（但模型已更新）

Question

我有一个显示用户电子邮件的简单模型，我正在使用 Google 进行身份验证。

这是我为身份验证编写的代码：

gapi.auth2.getAuthInstance().signIn().then((args) => {
  this.user = { email: args.wc.hg }
  console.log(this.user);
});

console.log 正确显示电子邮件，但模板未更新，我在浏览器上仍然看不到任何内容：{{user?.email}}。

还有一点，我只是用一个简单的承诺替换了身份验证：

new Promise<string>(resolve => setTimeout(() => resolve('email'), 10000)).then(data => this.user = { email: data });

这是有效的，我的模板正在显示 email。

我看不出这两个 promise 的解析有什么区别，但显然是有区别的。

你有什么想法吗？提前致谢。

Answer 1

那是因为它运行是用 angular2 framework.What 编码的，你可以做的是，你可以使用下面的代码手动检查变化检测，

import { Component, ChangeDetectorRef } from '@angular/core';    

export class MyComponent {
  constructor(private cdr:ChangeDetectorRef) {  //<----- injection
  }

  someMethod() {

    gapi.auth2.getAuthInstance().signIn().then((args) => {
       this.user = { email: args.wc.hg }
        console.log(this.user);

         this.cdr.detectChanges();              //<----Note this...
    });

  }
}

使用 Google 进行身份验证后，模板未更新（但模型已更新）

Template not updated (but model is) after authentication with Google

angular

promise

angular2-template

google-oauth

google-api-js-client