angularjs看單選按鈕換工作只在第一選擇

所以我有一個單選按鈕的列表，我試圖用指令中的$ watch觀看選擇的變化。我只能在第一次選擇這些元素時觸發手錶。angularjs看單選按鈕換工作只在第一選擇

我的HTML：

<p ng-repeat="(key,item) in option" style="margin-bottom:0px "> 
    <label> 
     <input type="radio" is-valid ng-model="value" selected-key="value" name="select" value="{{key}}" ng-checked="getChecked($index)"> {{item.name}} 
    </label> 
</p>

我的指令回報：

return { 
    restrict: "A", 
    scope: { 
     selectedKey: '=' 
    }, 
    link: function(scope, elem, attrs) { 
     scope.$watch('selectedKey', function(newValue, oldValue, scope) { 
      alert('triggered') 
     }); 
    } 
}

我在做什麼錯？我試着只看「價值」，但看不到觸發。

預先感謝您

來源

2015-05-17 Suman Lama

您可以簡單地使用'ngChange'。 https://docs.angularjs.org/api/ng/directive/ngChange你爲什麼需要自定義指令？ – Satpal

雅我可以做到這一點，但後來我不得不添加另一個控制器功能，我已經有一個名爲is-valid的指令屬性用於類似的任務。我認爲我認爲寫得更好會更好。 –

你要明白，ngRepeat創建每次迭代項目的新範圍。這意味着value是單獨的每個單選按鈕。因此，每個無線電輸入只會觸發一次鐘錶表達式，之後永遠不會改變。

你需要做的是使用保存選定無線電值的父範圍模型。您可以通過在控制器宣告模型，例如：

$scope.radio = {value: null};

實現這一目標，並使用此模型爲每個單選按鈕。另外我刪除了多餘的selected-key屬性，你不需要它，因爲你已經有ng-model指向同一個radio.value。

結合在一起的指令將是這樣的：

app.directive('isValid', function() { 
    return { 
     restrict: "A", 
     scope: { 
      selectedKey: '=ngModel' 
     }, 
     link: function(scope, elem, attrs) { 
      scope.$watch('selectedKey', function(newValue, oldValue, scope) { 
       console.log('triggered') 
      }); 
     } 
    }; 
});

演示：http://plnkr.co/edit/K8HJo8c81dFRKxZ2oyus?p=preview

來源

2015-05-17 07:52:49 dfsq

所以我的HTML將是 ' {{item.name}}' 對不對？每個單選按鈕只會觸發一次。 –

是的，檢查我提供的演示。 – dfsq

似乎我在腳本中遇到了一個小問題。工作謝謝。 –

angularjs看單選按鈕換工作只在第一選擇

回答

相關問題