AngularJS指令中的數據綁定的兩種方式

Question

我無法獲得在AngularJS指令中工作的兩種數據綁定方式。

下面是從模板我的HTML代碼，一個基本的控制器實例爲MyModel（這裏的數組）使用：

HTML

<select ng-if="mymodel" multipleselect values="mymodel"> 

DIRECTIVE

我有一個指令稱爲multipleselect：

return { 
    restrict: 'A', 
    scope : { 
    values : '=' 
    }, 
    link : function($scope, element, attrs){ 

    ... 
    $scope.values = ["some","nice","datas"]; //Actually works, the model is changed in the controller 

    $("select").change(function(){ //This is a callback, asynchronous situation 
     $scope.$apply(function() { //Using apply to notify the controller that we are changing its model 
      $scope.values = ["some","amazing","datas"]; //Not working :(
     }); 
    }); 
    } 
} 

爲什麼我的模型沒有更新第二個tim我改變它了嗎？

Answer 1

看着給，我認爲這將滿足您的需求，而無需使用自定義指令答案：

<select ng-if="mymodel" multiple ng-model="model.mymodel"> 

你的模式將當選擇改變時可以自動更新，可以看到here。

的egghead.io視頻"The Dot"有一個很好的概述，做到這一點非常流行的堆棧溢出問題：What are the nuances of scope prototypal/prototypical inheritance in AngularJS?

Answer 2

您不需要使用jQuery來監視更改。你可以寫這樣的（也解決您的問題）：

return { 
    restrict: 'A', 
    scope : { 
    values : '=' 
    }, 
    link : function($scope, element, attrs){ 

    $scope.values = ["some","nice","datas"]; 

    element.on("change", function(){ 
     $scope.values = ["some","amazing","datas"]; 
    }); 
    } 
}