摘要:同時(shí),依賴注入機(jī)制是依附于組件本身存在的,并不依附于模板的層級關(guān)系,因此不會面臨問題二的困擾。對于木偶組件本身,往往作為消費(fèi)者存在,這種情況下使用機(jī)制可能會達(dá)到更好的效果。
03-a Communicate Between Components Using Dependency Injection
原文: Communicate Between Components Using Dependency Injection
當(dāng)前的
我們無法在其中方式多個(gè)
如果一個(gè)
我們需要將這兩個(gè)問題作為新的目標(biāo):
我們可以增加多個(gè)相同類型的子組件(
并且可以使這些子組件放置在任意的自定義容器的視圖模板(views)中
實(shí)現(xiàn)針對第一個(gè)問題,我們使用@ContentChildren裝飾器(因?yàn)樗@取所有的子組件引用),但是它無法解決第二個(gè)問題。
為了同時(shí)解決這兩個(gè)問題,我們可以使用Angular提供的DI機(jī)制(dependency injection mechanism)。你可以將一個(gè)組件的祖先組件通過DI機(jī)制注入到子組件的構(gòu)造方法中,這樣你就可以通過祖先組件的引用來訪問它們的方法和屬性。
所以,
Note:成果
這里也可以使用service來共享狀態(tài),也許還會更便捷,但是我們可以通過DI來達(dá)到目的,我們可以在之后的章節(jié)(第十二章)來闡述service相關(guān)的內(nèi)容,這部分內(nèi)容會與React Context Provider的內(nèi)容對應(yīng)。
你可以在在線代碼倉庫看到,有兩個(gè)
這些子組件都會監(jiān)聽同一個(gè)
在線代碼演示(自備梯子):https://stackblitz.com/edit/a...
譯者注依賴注入是Angular中提供的很強(qiáng)大的功能,在angularjs中就表現(xiàn)出色并作為賣點(diǎn)。
如果仔細(xì)思考的話,我們可以發(fā)現(xiàn),在這一版的實(shí)現(xiàn)中,對于
同時(shí),依賴注入機(jī)制是依附于組件本身存在的,并不依附于模板的層級關(guān)系,因此不會面臨問題二的困擾。
對于木偶組件本身,往往作為消費(fèi)者存在,這種情況下使用DI機(jī)制可能會達(dá)到更好的效果。
文章版權(quán)歸作者所有,未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為,您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址:http://www.ezyhdfw.cn/yun/90808.html
摘要:為了適應(yīng)表單校驗(yàn)的靈活性,我們使用這種模式會事半功倍,提供校驗(yàn)信息的組件僅僅聲明渲染表單錯(cuò)誤提示信息需要設(shè)計(jì)的狀態(tài)變量即可,比如等等,對于錯(cuò)誤信息的文案及樣式,統(tǒng)統(tǒng)交由錯(cuò)誤提示組件的使用者完成。 06 Use Render Props最近在React社區(qū)中引起了轟動(dòng),但是與之類似的模式在Angular中似乎并沒有得到太多關(guān)注。我在之前寫的文章提及過,TemplateRefs就是Ang...
摘要:原文如那樣,我們將使用一個(gè)相對簡單的組件來說明這些模式。組件的職責(zé)是僅僅是管理一個(gè)簡單的布爾值狀態(tài)屬性。文件夾并且特別是,將針對庫在不同的情形下的使用做出相應(yīng)的改變。 寫在前頭 Angular到現(xiàn)在已經(jīng)到5.x的版本了,對于MVVM框架我首先接觸的是angularjs后來又轉(zhuǎn)為react,之后換了工作因項(xiàng)目技術(shù)棧的原因又轉(zhuǎn)換到之前的angularjs,在實(shí)際工作中實(shí)施了公司幾個(gè)比較重要...
摘要:目標(biāo)提供一些方法或指令給組件使用者,使其可以與所提供的元素交互并修改它們。這個(gè)指令擁有一個(gè)屬性并與組件共享,該屬性將決定屬性的值是還是。 07 使用 Content Directives 原文: Use Content Directives 因?yàn)楦附M件會提供所有相關(guān)的 UI 元素(比如這里的 button),所以 toggle 組件的開發(fā)者可能無法滿足組件使用者的一些附加需求,比如,...
摘要:相關(guān)話題裝飾器將會返回在組件標(biāo)簽包含的內(nèi)容中,第一個(gè)符合選擇器的子組件或者子指令的引用,比如。或者裝飾器是用來獲取在組件內(nèi)部模板中使用的單個(gè)或者多個(gè)組件的。 02 Write Compound Components 原文: Write Compound Components 目標(biāo) 我們需要實(shí)現(xiàn)的需求是能夠使使用者通過組件動(dòng)態(tài)的改變包含在它內(nèi)部的內(nèi)容。 實(shí)現(xiàn) 我們可以把toggle抽象...
摘要:實(shí)現(xiàn)模板引用變量是獲取某個(gè)元素組件或者指令引用的一種方式,這個(gè)引用可以在當(dāng)前的視圖模板中的任何地方使用。它們通常是以或者的語法聲明的。成果在中,我通過打印模板引用變量所指向的類的名字來演示它所代表的引用。 05 Handle Template Reference Variables with Directives 原文: Handle Template Reference Variab...
閱讀 3043·2023-04-26 01:32
閱讀 1638·2021-09-13 10:37
閱讀 2377·2019-08-30 15:56
閱讀 1759·2019-08-30 14:00
閱讀 3194·2019-08-30 12:44
閱讀 2031·2019-08-26 12:20
閱讀 1259·2019-08-23 16:29
閱讀 3308·2019-08-23 14:44