指令不更新我的范围

Directive do not update my scope

本文关键字：范围 我的 更新 指令      更新时间：2023-09-26

我在应用程序周围使用一个作用域来显示一个微调器，同时执行异步请求。

该范围为：$scope.showSpinner = true / false

现在我正在处理一个指令，代码是这样的：

'use strict';
angular.module('orders').directive('resetOrder', ['$rootScope', function ($rootScope) {
  return {
    restrict: 'A',
    link: function (scope, element, attrs) {
      var order_id = attrs.resetOrder;
      element.bind('click', function (event) {
        event.stopPropagation();
        alertify.confirm(
          'Warning!',
          'Are you sure you wish to RESET order id: ' + order_id + '?',
          function () {
            scope.showSpinner = true;
            [ ... ]
          }, function () {
            return;
          }
        );
      });
    }
  };
}]);

scope.showSpinner没有传播，按下重置按钮后我看不到微调器处于活动状态。

到目前为止我尝试过：

我将$scope转换为$rootScope，不起作用。我添加了scope.$apply()甚至$rootScope.$apply()，不起作用。我把它包在$timeout里，没有工作。我创建了一个范围：{ showSpinner： '=' }，没有工作。

我无法摆脱这个问题。我做错了什么？

以下是我在 HTML 中添加指令的方式：

<button reset-order="{{ order.id }}">

提前感谢您的帮助。

当您处于 alertify.conconfirm 的回调中时，您处于角度上下文之外，因此不会反映对范围属性的任何更改。

尝试：

scope.$apply(function () {
  scope.showSpinner = true;
});

也许是因为您的指令存在致命缺陷。在给定范围内只能使用它一次。每次都需要创建一个不同的控制器才能重用指令。这显然不是一个很好的解决方案。

您希望能够做的是将指令内部的作用域与外部作用域分开，然后将外部作用域映射到指令的内部作用域。您可以通过创建我们所说的隔离作用域来执行此操作。为此，您可以使用指令的 scope 选项。

https://docs.angularjs.org/guide/directive

隔离范围后，将观察程序添加到指令中以监视更改。例：

scope.$watch('showSpinner', function (newValue, oldValue) {
    if (newValue == oldValue) {
        return;
    }
    //do something
});
相关文章：