Question

所以我知道使用双向绑定=，在一个指令中，控制器的值可以传递给指令。但是，如何将隔离指令中的更改传递回控制器？

例如，我有一个表单，其中有一个滑块，该滑块使用带有隔离范围的指令构建。初始值从控制器设置，然后使用隔离范围更改指令。

我尝试做的是在具有双向绑定的指令变量也发生变化时更改控制器的值。

有什么建议吗？

Answer 1

您有两种可能的方法来实现这一目标。一种是在控制器中为传递给指令隔离范围的变量创建一个watch语句。

// 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事件发送任何事件信号，如果变量已经改变。

也许这篇文章可以帮到你。

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

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

2 个答案: