AngularJS 指令雙向數據綁定在觀察時不起作用 Boolean

Question

我有一個雙向數據綁定，它不會改變發送到指令的變量值。

我的指令監視觸發器並將焦點放在 associates 元素上（基於在 SO 找到的代碼）：

app.directive('focusMe', function ($timeout) {
  return {
    scope: {
      trigger: '=focusMe'
    },
    link: function (scope, element, attrs) {
      scope.$watch('trigger', function(value) {
        console.log("directive value: " + value);
        console.log("directive start: " + scope.trigger);
        if (value === true) {
          $timeout(function () {
            element[0].focus();
            scope.trigger = false;
            console.log("directive end: " + scope.trigger);
          });
        }
      });
    }
  }
});

在HTML中我是這樣調用的：

<input type="text" ng-model="item.value" focus-me="focusInput" />

當我第一次觸發它時，它起作用了——因為focusInput變量切換了它的值。 但是控制器focusInput中的 focusInput（在指令之外）在指令完成時不會切換回false 。

假設我了解應該發生的情況，當我調用scope.trigger = false時應該會切換回false 。

缺少什么會導致雙向綁定不將值推回傳遞給指令的變量？

更新 01：

為了發布問題，我刪除了一小部分代碼。 HTML 實際上是這樣的：

<input type="text" ng-model="item.value" focus-me="focusInput" ng-if="item.condition != 'matches' && item.condition != 'does not match'" />

如果input字段隱藏然后重新顯示（基於ng-if ），該指令將在第一次focusInput更改時正確給予焦點。 之后它將再次停止工作......除非重復隱藏/顯示過程。

Answer 1

在范圍內處理原始值（布爾值，整數等）時，您遇到的問題是一個常見問題。

我強烈建議閱讀Understanding Scopes文章。 （簡短回答：原語在指令的隔離范圍內被更改，並且不會尋找父范圍的鏈，即您的控制器范圍）。

至於如何解決你的情況，我建議使用點表示法並將你的原語存儲在一個對象中，並將這個對象綁定到你的指令：

scope: {
   triggerObj: '=focusMe'
},

並確保指令中的觸發器引用現在是scope.triggerObj.trigger 。

在你的控制器中有：

$scope.triggerObj = {};
$scope.triggerObj.trigger = true; //or false, what have you

擁有一個對象將確保雙向綁定將起作用。 有空的時候閱讀上面的文章:)

Answer 2

指令創建范圍。 當您將參數傳遞給作用域時，通過引用傳遞的對象和通過值傳遞的布爾值（以及數字，字符串...）。

例如：

function changeToFalse(bool) {
    bool= false;
    console.log(bool);  // false
}


function changeObjToFalse(obj) {
    obj.bool= false;
    console.log(obj.bool);  // false
}

var obj = {bool : true};

changeToFalse(obj.bool);
console.log(obj.bool);  // true
changeObjToFalse(obj);
console.log(obj.bool); // false

另見同一問題 - 雙向綁定不能與ng-repeat一起使用 。

Answer 3

我的情況如下：

parentCtrl  
-> directive1  
--> directive2  

我試圖通過雙向綁定將 parentCtrl.Model.variable 傳遞給 directive2。

由於上述問題，更新無法從 directive1 返回到 parentCtrl。 在 directive1 中使用虛擬 object，我還需要一個手表來將值傳遞給 parentCtrl。

我最終在指令 1 中嘗試了以下技巧：
$scope.scp = $scope;
並將指令 2 綁定到 scp.variable。

綁定是這樣工作的，但我不知道這種 hack 可能存在的缺點。 歡迎輸入！