範圍變更不是針對

應用我有一個template.html指令，由包括NG-包括，在這個指令我改變的範圍，但它不是我的觀點改變範圍變更不是針對

這裏是我的html

<div ng-controller="myCtrl"> 
    <div id="modal"> 
     <div ng-show="showDIv">Somthing to controll</div> 
    </div> 
    <div ng-include src="template.html"> 
</div>

這裏是我的模板

<a ng-support></a>

這裏是我的指令

app.directive('ngSupport', function(){ 
    return { 
     restrict: 'A', 
     link: function(scope, elem, attr, ctrl) { 
      elem.bind('click', function(e) { 
       $("#modal").dialog({height:518,width:900,modal:true }); 
       scope.showDiv = true; 
       scope.$apply(); 

      }); 
     } 
    }; 
});

當我改變指令的範圍它不適用於視圖，任何人都可以幫忙嗎？

來源

2013-08-01 user2626210

'showDIv'與'showDiv'（注意外殼）在這裏還是在你的代碼中有一個錯字？ –

ng-include創建一個新的範圍，所以scope.showDiv隻影響本地範圍。取決於您希望如何構建應用程序，您可以嘗試訪問scope.$parent.showDiv，但這並不是真正的將來證明，因爲它取決於HTML嵌套。

更好的解決方案是將showDiv屬性存儲在父範圍內的對象內。例如scope.ui = {}，這樣，當您在指令中設置scope.ui.showDiv = true時，它會自動查找父範圍（使用原型繼承），而不是將屬性添加到本地範圍。

最後，另一個解決方案是重構你的代碼，使其不那麼複雜：我認爲使用ng-include僅僅用於添加一個元素是一種矯枉過正，你可以直接在你的html中插入<a ng-support></a>，這將避免問題你有一箇中間範圍正在生成。

來源

2013-08-01 10:08:38 Yann

另一種選擇是廣播一個事件，並在控制器中監視它。像這樣的東西。

app.directive('ngSupport', function($rootScope){ 
    return { 
     restrict: 'A', 
     link: function(scope, elem, attr, ctrl) { 
      elem.bind('click', function(e) { 
       $("#modal").dialog({height:518,width:900,modal:true }); 
       $rootScope.$broadcast('event:modal-clicked'); 
      }); 
     } 
    }; 
});

在你的控制器中。

$scope.$on('event:modal-clicked', function() { 
    $scope.showDiv = true; 
});

來源

2013-08-01 16:26:35

範圍變更不是針對

回答

相關問題