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

所以我知道，通过双向绑定，=，在指令中，控制器的值可以传递到指令中。但是如何将隔离指令中的更改传递回控制器

例如，我有一个窗体，它有一个滑块，该滑块由一个具有独立作用域的指令构建。从控制器设置初始值，然后在指令中使用隔离范围进行更改

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

我要做的是，当具有双向绑定的指令变量也发生变化时，更改控制器的值

---

有什么建议吗？

你有两种可能的方法来实现这一点。一个是在控制器中对传递到指令隔离范围的变量创建一个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可以是控制器中的任何方法

主要的好处是，您拥有在指令中通知某人的逻辑，而不是通过手表隐式地通知控制器

---

希望这能让你走上正确的方向。

你有两种可能的方法来实现这一目标。一个是在控制器中对传递到指令隔离范围的变量创建一个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可以是控制器中的任何方法

主要的好处是，您拥有在指令中通知某人的逻辑，而不是通过手表隐式地通知控制器

---

希望这能让你走上正确的方向。

如果你已经将任何变量传递到隔离作用域，你可以绑定它并在它的两侧设置任何侦听器。如果变量已经更改，你可以使用Angularjs事件发送任何信号

也许这篇文章可以帮助你

---

如果您已经将任何变量传递到隔离作用域，您可以绑定它并在其两侧设置任何侦听器。如果变量已更改，您可以使用Angularjs事件发送任何信号

也许这篇文章可以帮助你

---

这是默认情况下完成的。为您的问题创建一个plunker，这样我们可以更好地帮助您。好的，可能需要一些时间。但问题是，当从视图中以外的任何位置调用变量时，变量不会发生更改。问题是，当调用表单提交函数时，或者在视图中直接显示变量之外的任何位置引用变量时，变量不会发生更改。默认情况下，这是这样做的。为您的问题创建一个plunker，这样我们可以更好地帮助您。好的，可能需要一些时间。但问题是，当从视图之外的任何地方调用变量时，它不会改变。问题是，当调用表单提交函数时，或者该变量除了直接显示在视图中之外，还可以在任何地方引用。我注意到，超过50%的帖子包含指向w3docs.com的链接，而只有4篇包含任何链接的帖子没有指向w3docs.com。如果你以任何方式与w3docs有关联，那么你需要披露这种关联。我注意到，你超过50%的帖子包含指向w3docs.com的链接，只有4篇包含任何链接的帖子没有指向w3docs.com。如果您以任何方式与w3docs有关联，那么您需要披露该关联。