создать объект со свойствами для хранения данных пользователя loggedIn и связать/обновить их для просмотра

Question

Примечание: пожалуйста, игнорируйте синтаксическую ошибку для этого сообщения.
Моя настройка проекта следующая.

boot.ts < = ParentComponet, имеет <routerOutlet> & суб компонентов, содержит навигацию по подразделам coponents.
----- Home.ts < = вид по умолчанию с помощью useAsDefault
----- login.ts < = но по наиважнейшей routerOutlet, проверить проверку подлинности ли пользователь или нет. Если нет (здесь явно), загрузите компонент входа.

---

models.ts

export class UserModel() 
{ 
    private userName:string; 
    private isLoggedIn:boolean; 
} 

authService.ts

import {UserModel} '.../models.ts' 
... 
... 
public let um=new UserModel(); // I don't know how to go ahead from here. 
constructor() 
{ 
    um.userName="Guest"; 
    um.loggedIn=true; // lets not deal with it for now. 
} 

setUserDetail(username:string) 
{ 

    um.userName=username; 
    um.loggedIn=true; 


    Please note here that when it changes um model, I want to update boot.html view 
} 

getUserDetail:UserModel() 
{ 
    return um; 
} 

authentication(username:string,password:string) 
{ 
     ...// I have http server call here. but not shown. 
     ... //database query 
     um.userName= "field from DB"; 
     um.loggedIn=true; 
     ...//return observable 
} 

login.ts ...

login(username,password) 
{ 
    auth.authentication(username,password) 
    .subscribe(() => { 
    auth.setUserDetail(username); // this should update boot.html view immediately. 
    }); 
} 

boot.ts

import {UserModel} '.../models.ts'; 
import {authService} '.../authService.ts'; 

constructor(auth:authService) 
{ 
    console.log(auth.getUserDetail()); //log is correct. no problem till here. 

    // Note: When we run the app, it may get UserModel object and display to VIEW. But after login how can I update boot.html view? 

    1) how to bind upcoming object value to view? 
    2) when page is refreshed same object should be returned.   
} 

boot.html

... 
<li ngIf="{{um.loggedIn}}">{{um.userName}}</li> 
... 

мне нужно использовать EventEmitter ли?

http://plnkr.co/edit/uPb0eHXPke41zSa9IBdS?p=preview
Это показывает, как обновить два представления с использованием общей службы.

если кому-то интересно узнать о переопределении routerOutlet
Angular 2 Authentication with child routes

Answer 1

Я найти код вашего метода login немного странно. Я хотел бы использовать это вместо того, чтобы определить функцию обратного вызова, предоставленный методом subscribe:

login(username,password) 
{ 
    auth.authentication(username,password) 
    .subscribe(() => { 
    auth.setUserDetail(username); // this should update boot.html view immediately. 
    }); 
} 

Редактировать

Вы можете использовать свойство EventEmitter в вашу службу. Более подробную информацию смотрите по этой ссылке:

• Delegation: EventEmitter or Observable in Angular2