AngularJS從指令控制器將數據傳遞到另一個

我有一個表格，這與您可以編輯圖片庫，當然我創建了一個指令，它，像這樣：AngularJS從指令控制器將數據傳遞到另一個

galleryEdit.html

<div> 
    <form ng-submit="submit()"> 
    <label>Headline:</label> 
    <input type="text" ng-model="gallery.headline" placeholder="Enter headline here" value=""/> 

    <label>channels:</label> 
    <channelselect></channelselect> 

    <input type="submit"/> 
    </form> 
</div>

所以，galleryEdit還有一個指示信道選擇，這與您可以選擇的通道（不僅是畫廊）

channelselect.html

<div> 
    <select> 
     <option value="{{channel.shortCode}}">{{channel.name}}</option> 
    </select> 
</div>

GalleryEdit有一個控制器，爲其指令傳遞數據（稱爲「圖庫」），因此其$ scope具有$ scope.gallery屬性，其中包含通道ID：$ scope.gallery.channel。由於channelselect具有不同的控制器，它具有其範圍，因此無法從該範圍中看到此gallery.channel。有沒有什麼方法可以將圖庫中的數據傳遞給通道控制器/指令？使用$ scope。$ parent不是解決方案，因爲channelSelect不應該知道數據來自哪裏。

來源

2013-02-04 user2039598

僅僅因爲兩個指令都有一個控制器並不意味着它們有單獨的作用域。指令定義對象上的'scope'屬性確定是否創建新的作用域（或否），以及新作用域是否爲隔離作用域。所以一個可能的解決方案是不創建任何新的範圍，那麼這兩個指令將共享相同的範圍，並因此可以訪問所有相同的$範圍屬性/數據。 –

您可以在您的galleryEdit指令的範圍和channelselect指令的範圍之間設置雙向綁定。

在你channelselect指令的定義，你可以這樣做以下：

directive('channelselect', [function() { 
    ... 
    scope: {channel: '='} 
    ... 
}])

這將創建一個隔離範圍您channelselect指令，並讓你使用channel屬性您<channelselect>標籤設置雙向綁定到其父範圍。

所以現在你可以在galleryEdit.html做到這一點：

<channelselect channel="gallery.channel"></channelselect>

現在channelselect的$scope.channel將被綁定到galleryEdit的$scope.gallery.channel。

查看指令定義對象 AngularJS的Directives部分指南瞭解有關隔離範圍的更多詳細信息。

來源

2013-02-04 14:19:35

謝謝老兄，這個作品完美。 – user2039598

AngularJS從指令控制器將數據傳遞到另一個

回答

相關問題