可重複DOM元素上的角度ng模型

是否可以使用HTML標記單獨定義Angular中的ng模型範圍？可重複DOM元素上的角度ng模型

我的標記：

<section> 
    <button ng-click="boxOpen = !boxOpen">Open/Close</button> 
    <div ng-show="boxOpen">Stuff in here</div> 
</section> 

<section> 
    <button ng-click="boxOpen = !boxOpen">Open/Close</button> 
    <div ng-show="boxOpen">Other stuff in here</div> 
</section>

的問題與上述是「boxOpen」正在全球範圍內雙方的解釋，所以點擊任一按鈕將顯示/隱藏，同時二者的div。

任何幫助，謝謝！

來源

2014-11-13 saricden

爲什麼不以不同的方式命名變量？完全創建一個新的範圍/控制器似乎對我來說過分了 –

我希望能夠在各個地方重複使用標記，而不必爲每個地方提供一個唯一的名稱。 – saricden

在這種情況下，最好的方法是創建一個指令，如[@BastienSander]（http://stackoverflow.com/users/1361124/bastiensander）所指出的。 –

如果定義2個不同的控制器，你會得到兩個不同的範圍

<section ng-controller="ctrl1"> 
    <button ng-click="boxOpen = !boxOpen">Open/Close</button> 
    <div ng-show="boxOpen">Stuff in here</div> 
</section> 

<section ng-controller="ctrl2"> 
    <button ng-click="boxOpen = !boxOpen">Open/Close</button> 
    <div ng-show="boxOpen">Other stuff in here</div> 
</section>

你也可以做一個指令

HTML

<section my-show-hide-dir> 
    <button ng-click="boxOpen = !boxOpen">Open/Close</button> 
    <div ng-show="boxOpen">Stuff in here</div> 
</section> 

<section my-show-hide-dir> 
    <button ng-click="boxOpen = !boxOpen">Open/Close</button> 
    <div ng-show="boxOpen">Other stuff in here</div> 
</section>

 app.directive("myShowHideDir", 
    function() { 
     return { 
      restrict: 'A', 
      controller: ['$scope', '$element', '$attrs', 
       function($scope, $element, $attrs) { 
        $scope.boxOpen = false; 
       } 
      ] 
     } 

    } 
);

來源

2014-11-13 16:24:02 BastienSander

沒有爲此添加一個單獨的控制器（或類似的荒謬），你不能這樣做。

這裏最好的方法是製作那些按鈕指令，每個指令都有自己的隔離範圍......或者，使用兩個不同的變量名稱，每個按鈕一個（或者如果計劃有一個很多按鈕）。

但我強烈建議採取指示的方法。

來源

2014-11-13 16:25:19 Shomz

可重複DOM元素上的角度ng模型

回答

相關問題