Angular 2、如何将值存储到ngOnInit()的变量中？

Question

在这里，当我登录到我的应用程序时，我想获取存储在本地存储中的 json 对象，然后将其分配给用户对象。如果我第一次登录，它不会显示任何内容，但如果我刷新页面，我可以看到名字。

这是.ts文件

import { Component, OnInit } from '@angular/core';
@Component({
    selector: 'app-navbar',
    templateUrl: './navbar.component.html',
    styleUrls: ['./navbar.component.css']
})
export class NavbarComponent implements OnInit {
    user: Object;
    ngOnInit() {
    this.user = JSON.parse(localStorage.getItem('user'));
    }
}

在模板中我想这样使用它：

<p> {{ user.first_name }} </p>

我该如何解决这个问题？

Answer 1

您的 html 在设置变量之前呈现

在你的 html 中使用这个：

<p> {{ user?.first_name }} </p>

这称为安全导航运算符，它将防止错误并在填充时呈现 first_name。

Answer 2

经过适当的搜索，在这里找到了我的答案。

@Wesley Coetzee，感谢您的支持。

Angular 2、如何将值存储到ngOnInit()的变量中？

Angular 2, How to store value in variable from ngOnInit()?

javascript

typescript

angular2-routing

angular