angular ComponentFactoryResolver 使用 @ Input

angular

Zaku 2018-10-22 11:17:07 ‧ 2219 瀏覽

angular的動態載入:
https://angular.io/guide/dynamic-component-loader

他好像不用@Input去塞資料，下面這篇好像是說不行，這樣很麻煩阿..

https://stackoverflow.com/questions/39280057/how-do-you-use-input-with-components-created-with-a-componentfactoryresolver

但是兩年前的文不知現在有沒什麼解?

登入發表討論

直播研討會

{{ item.channelVendor }} {{ item.webinarstarted }} |

直播中

1 個回答

黃升煌 Mike

iT邦研究生 5 級 ‧ 2018-10-22 13:58:39

最佳解答

可以注意這一行

(<AdComponent>componentRef.instance).data = adItem.data;

代表你其實不需要 @Input 就可以傳入資料

或是有什麼非用 @Input 不可的原因嗎?

回應 6
分享
檢舉

看更多先前的回應...收起先前的回應...

Zaku iT邦新手 3 級 ‧ 2018-10-22 14:13:51 檢舉

恩我現在是用componentRef.instance去塞，恩好像沒有一定要用到@Input，componentRef.instance好像反而更簡潔。只是不是很了解componentRef.instance不知道是不是好的方式。順帶一問componentRef.instance.某個值該如何定義typescript?

黃升煌 Mike iT邦研究生 5 級 ‧ 2018-10-22 19:06:13 檢舉

不用特別定義，直接轉型成元件的型別即可

(<AdComponent>componentRef.instance)

Zaku iT邦新手 3 級 ‧ 2018-10-22 23:52:59 檢舉

(<AdComponent>componentRef.instance)抱歉我不太清楚"轉型成元件的型別"的意思？

黃升煌 Mike iT邦研究生 5 級 ‧ 2018-10-23 07:05:42 檢舉

AdComponent 是一個類別，透過上述的程式，已經讓 TypeScript 認定 componentRef.instance 就是 AdComponent 類別了

Zaku iT邦新手 3 級 ‧ 2018-10-23 14:59:05 檢舉

感謝大大，但我宣告componentRef.instance.data = data會顯示[ts] 類型 '{}' 沒有屬性 'data'

黃升煌 Mike iT邦研究生 5 級 ‧ 2018-10-23 15:51:54 檢舉

應該要確定你在 component 的 data 是否有定義型別
或是分享一下你的程式碼, 比較好確認

登入發表回應

我要發表回答

立即登入回答

參賽組數

1123 組

團體組數

52 組

累計文章數

23096 篇

完賽人數

656 人

15th鐵人賽 13th鐵人賽 14th鐵人賽 12th鐵人賽 11th鐵人賽鐵人賽 2019鐵人賽 2018鐵人賽 javascript 2017鐵人賽 python windows php c# windows server linux css react 程式設計 vue.js

IT邦幫忙