谷歌登錄后顯示用戶daya ionic

Question

制作這個應用程序幾個小時后，我被谷歌登錄卡住了，我之前問過問題但仍然卡住了。

所以我有 logic.service.ts 處理用戶登錄並將他們的數據存儲在 localStorage 中

login(){
    this.googlePlus.login({
      'webClientId' : '927898787134-spvfdmvm9apq0e1fo2efvvura8vqpid8.apps.googleusercontent.com',
      'offile' : true
    }).then(res=>{
      firebase.auth().signInWithCredential(firebase.auth.GoogleAuthProvider.credential(res.idToken))
      .then(suc=>{
        // console.log('users', JSON.stringify(suc));
        this.storage.set('user', JSON.stringify(suc));
        this.router.navigate(["/tabs/home"]);
      }).catch(ns=>{
        alert('Unsucessful');
      })
    })
  }

然后我嘗試獲取用戶數據並將其顯示在其他頁面上，但我被卡住了，因為我沒有得到我需要的東西。 在我的 home.page.ts

     userData:any;
  loginDetails:any;
  subscribe: any;
  user:any={};
  public items: any;
  constructor(
    private iab: InAppBrowser,
    private router: Router,
    public platform: Platform,
    private service: LogicService,
    private nativeStorage: NativeStorage
    ) {

    this.subscribe = this.platform.backButton.subscribeWithPriority(666666, () => {
      if (this.constructor.name === 'HomePage') {
        if (window.confirm('Do you want to exit the app?')) {
          (navigator as any).app.exitApp();
        }
      }
    });
    let userData = JSON.parse(localStorage.getItem('user'));
    console.log(userData.user);
    console.log(userData.user.displayName);
    console.log(userData.user.email);
    console.log(userData.user.photoURL);
  }
  go() {
      this.router.navigateByUrl('tabs/login');
  }

  ngOnInit(){
    this.service.getLocalData().subscribe(
      data => {this.items = data});
  }
  webview(url){
    this.iab.create(url, '_self', 'location=no,toolbar=no,zoom=no');
  }

我調用數據並將其解析為對象，當我調用 console.log(user) 時，它向我顯示了這一點

但是當我嘗試調用 user.displayName 它說 undifined

更新我的代碼后，我可以記錄我的數據，但我正在嘗試像這樣在 html 上顯示它

<div class="header">
          <h3 style="font-weight: bold;">{{ userData.user.displayName }}</h3>
          <p style="color:grey;font-weight:bold;">Get closer with us!</p>
        </div>

但現在我收到這樣的錯誤

Answer 1

您正在訪問不正確的對象，而是使用：

let userData = JSON.parse(localStorage.getItem('user'));
console.log(userData.user.displayName);

此外，如評論中所述，您需要將userData定義為類級別，以便它在您的模板中可見（確保您不要在構造函數中重新定義它，因為它會隱藏類級別變量）。