Question

我一直在到处寻找这个答案。我有一个标头组件，我想显示当前登录用户的名称。在header.component.html中：

<a href="javascript:void(0)" class="nav-link" ngbDropdownToggle>
                <i class="fa fa-user"></i>USERNAME HERE<b class="caret"></b>
            </a>

和header.component.ts中，我在构造函数和ngOnInit之外都有此方法

displayName(){
    return localStorage.getItem("username");
}

有没有一种方法可以在标题上显示该用户名？

Answer 1

我认为您没有存储数据。

如何存储用户名？您在哪里存储数据？

如果您存储在单个物品中，例如

displayName(){
   return localStorage.getItem("username"));
}
ngOnInit() {
  localStorage.setItem("username","adiós mundo");
}

如果我存储一个对象，那么你会喜欢

displayName(){
   return JSON.parse(localStorage.getItem("data")).userName;
}
ngOnInit() {
   let data={userName:"Hola Mundo",eamil:"qqq@qqq.com"}
   localStorage.setItem("data",JSON.stringify(data));
}

我将代码放在ngOnInit中，我想您将数据存储在表单提交中

在标题Angular6中显示用户名

1 个答案: