Angular CLI 在開發 SPA 的時候,如何更換 View

#1

環境: Angular 7
請問在開發 SPA (Single Page Application)時,要如何透過 button 切換顯示不同的 view (component)
假設我有兩個 button,我希望的行為如下:

  1. 按 button1 要顯示 component_a, 然後把 component_b 關掉(或隱藏).
  2. 按 button2 要顯示 component_b, 然後把 component_a 關掉(或隱藏).
    但我不想用 router的方式。請問應該如何處理?
    我知道的作法就是在 component_a.html 與 component_b.html 用 div 包起來,然後加上 *ngIf=‘switchVar’ 。然後 button 去控制 switchVar 的值。但這個 switchVar 變數要放在 app.component.ts 裡,然後讓 child component (component_a.ts, component_b.ts)可以存取控制。
    但我不確定這是不是 Angular 李建議的作法?如果不是,那 Angular 李建議的作法是什麼?
    謝謝
0個讚

#2

切換component可以使用ngSwitch
一樣用button控制switchVar
https://angular.io/guide/template-syntax#the-ngswitch-directives

0個讚

#3

不確定你的case使用sub route適不適合,可以考慮看看?

0個讚