通过隔离范围指令中的更改更改控制器变量值

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