Angular 元件溝通

angular component router parm

ekekvivi 2019-04-17 18:17:26 ‧ 1466 瀏覽

大家好
小妹我還是Angular新手
目前遇到一些問題
還請各位幫忙解釋ＱＱ

我有AB兩個page (資料顯示)
這兩頁的樣式與格式(表格)完全一樣
只有資料不同
然後分別有編輯的功能
(要跳轉到另一頁 ex: URL= A/edit?id="123")

我把表格單獨出來變成component (tableComponent)
然後這兩個頁面再去載入

現在遇到的問題是
我表格這頁單獨拆出來
可是我表格內有按鈕
請問我要怎麼在A page去呼叫 table component的按鈕
然後再A page去寫各自的點擊事件

小碼農米爾 iT邦高手 1 級 ‧ 2019-04-17 20:09:32 檢舉

提供三種做法:

1. 使用 <ng-content> 可以直接在外面寫 button 的 tag (類似material的mat-table，但不確定官方是不是用 ng-content 來做的)
2. 子組件可以透過 @Output 將按鈕事件打出來
3. 透過 @Input 將 A 或 B 傳入子組件，再由內部跳轉

程式靈活度應該是 1 > 2 > 3

不過如果是我 table 不會另外做成 component 呢~
會直接用 *ngFor 來做~

登入發表討論