通過隔離范圍指令中的更改更改控制器變量值

Question

因此，我知道通過兩種方式綁定= ，可以在指令中將控制器的值傳遞到指令中。 但是，如何將隔離指令中的更改傳遞回控制器？

因此，例如，我有一個表單，其中包含使用帶有隔離范圍的指令構建的滑塊。 初始值由控制器設置，然后在指令中更改隔離范圍。

我正在嘗試做的是當帶有雙向綁定的指令變量也發生變化時，更改控制器的值。

有什么建議么？

Answer 1

您有兩種方法可以實現這一目標。 一種是在控制器中，在您傳遞到指令隔離范圍的變量上創建監視語句。

// code in view controller
$scope.sliderValue = 0;
$scope.$watch('sliderValue', function(newValue) {
  if (angular.isDefined(newValue)) {
    // Do stuff with new slider value
  }
});

請注意，我們需要isDefined ，因為每個監視都會在范圍編譯時觸發且初始值未定義。

另一種方法是使用一個參數增強指令，該參數在滑塊值更改時進行評估（很像回調函數）。

// sample directive code
angular.module('my-ui-controles', []).directive('mySlider', [function() {
  return {
    template: '...',
    scope: {
      value: '=mySlider',
      onChange: '&'
    },
    link: function(scope, elem, attrs) {
      // assume this is called when the slider value changes
      scope.changeValue = function(newValue) {
        // do other internal stuff and notify the outside world
        scope.onChange({value: newValue});
      }
    }
  }
}])

現在您可以像這樣在模板中使用它：

<div my-slider="sliderValue" on-change="doStuff(value)"></div>

現在發生的事情是，一旦滑塊值更改，我們就會評估傳遞到指令中的onChange表達式。 doStuff的值將填充新的滑塊值。 實際上，我們傳遞給onChange的對象是計算表達式的范圍， doStuff可以是控制器中的任何方法。

主要好處是您具有在指令中通知某人的邏輯，而不是通過監視在控制器中隱式地通知某人。

希望能帶給您正確的方向。

Answer 2

如果您將任何變量傳遞給隔離的范圍，則可以在兩側將其綁定（在其上設置任何偵聽器）。您可以使用Angularjs Events事件發送任何信號（如果變量已更改）。

也許這篇文章可以為您提供幫助。

http://www.w3docs.com/snippets/angularjs/bind-variable-inside-angularjs-directive-isolated-scope.html

http://www.w3docs.com/snippets/angularjs/change-variable-from-outside-of-directive.html