当app-routing模块加载组件时，ngOnit没有被执行

Question

This ngOnInit does not execute the console.log line

ngOnInit() {
  this.loadBlogPosts();
  this.authStatusService.getAuthUsername().subscribe(
    status => {
      // got username status
      console.log("This is the username status from home", status);
      this.authUsername = status;
    }
  );
}

This line is executed

this.loadBlogPosts();

This line is not executed:

console.log("This is the username status from home", status);

This is the app-module.ts.

const routes: Routes = [
  { path: '', component: HomeComponent, pathMatch: 'full' },

  { path: 'home', component: HomeComponent },
  { path: 'add', component: BlogPostAddEditComponent  },
  { path: 'posts', component: BlogPostsComponent },
  { path: 'post', component: BlogPostComponent },
  { path: 'auth', component: AuthComponent },
  { path: 'blogpost/:id', component: BlogPostComponent },
  { path: '**', redirectTo: '/' }
];

This is the app.component.html

<app-headernav></app-headernav>
<router-outlet></router-outlet>

This is the service:

export class AuthStatusService {

  authUsernameChange: Subject<string> = new Subject<string>();

  constructor() { }


  public getAuthUsername(): Observable<string> {
     return this.authUsernameChange.asObservable();
   }

   public setAuthUsername(user: string) {
       this.authUsernameChange.next(user);
     }
}

Answer 1

There's nothing wrong with ngOnInit here. this.authStatusService.getAuthUsername() returns an observable, so the handler in this code:

this.authStatusService.getAuthUsername().subscribe(
    status => {
      // got username status
      console.log("This is the username status from home", status);
      this.authUsername = status;
    }
  );

will only execute when the observable emits a new value. ngOnInit is only registering the observable handler method. You need to emit a value somewhere after the call to ngOnInit maybe with this.authStatusService.setAuthUsername(something) ; If you need the last emitted value you should use a BehaviorSubject instead of Subject in authUsernameChange

 authUsernameChange: BehaviorSubject <string> = new BehaviorSubject <string>(initialValue);