为何Angular中*ngIf结合Observable的判断条件被忽略？

以下是我的主组件代码：

HTML模板：

<div *ngIf="user$ | async">
  <h1>test</h1>
</div>

组件类：

@Component({
  selector: 'app-core',
  templateUrl: './core.component.html',
  styleUrls: ['./core.component.scss']
})
export class CoreComponent {
  @Select(UserState) public user$!: Observable<User>;
  constructor() {}
}

我用NGXS实现的UserState如下：

@State<UserStateModel>({
  name: 'user',
})
@Injectable()
export class UserState {
  constructor(
    private api: ApiService,
    private tokens: TokenService) { }

  @Action(GetUser)
  public get(ctx: StateContext<UserStateModel>) {
    const id = this.tokens.getAccessTokenPayload()!.sub;
    return this.api.get<User>(Endpoint.USERS, id).pipe(
      tap((user: User) => {
        ctx.setState(user);
      })
    );
  }
}

为什么在用户状态还没初始化的时候，*ngIf的判断条件就被忽略了，router-outlet仍然会被渲染？（附Redux DevTools截图）

参考Michaël的回答后我做了如下修改：

更新后的HTML模板：

<div *ngIf="user">
  <h1>test</h1>
</div>

更新后的组件类：

@Component({
  selector: 'app-core',
  templateUrl: './core.component.html',
  styleUrls: ['./core.component.scss']
})
export class CoreComponent implements OnInit {
  public user?: User;
  constructor() {}
  public ngOnInit(){
    this.store.select(UserState).subscribe((user) => {
      this.user = user;
    });
  }
}

只是出于测试尝试了这种写法，但用户状态还是会被初始化，我对此感到困惑。

内容的提问来源于stack exchange，提问作者Julien LeGa