Отображение имени пользователя в заголовке Angular6

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, я полагаю, вы храните данные в отправке формы