Question

我有一个在地图中包含圆圈的表单。 “圈选择器”实现为一个指令，用于呈现GoogleMaps映射并从父作用域（表单所在的位置）更新双向绑定对象（在指令范围内使用'='）。

代码如下：

表单HTML

<!-- View uses controllerAs:"vm" -->
<circle-location-picker circle="vm.circle"></circle-location-picker>
<input type="hidden" ng-model="vm.circle.center" name="center" required>
<input type="hidden" ng-model="vm.circle.radius" name="radius" required>

圈选择器指令（摘录）：

angular
  .module('frontend')
  .directive('circleLocationPicker', CircleLocationPicker);

function CircleLocationPicker() {
  return {
     templateUrl: 'app/directives/circleLocationPicker/circleLocationPicker.html',
     restrict: 'E',
     scope: {
       'circle': '='
     },
     controller: MapController
  };

  function MapController($scope, ...) {
    // Called when the circle is changed in the map
    function circleChanged() {
      var center = $scope.gcircle.getCenter();

      $scope.circle.center.latitude = center.lat();
      $scope.circle.center.longitude = center.lng();
      $scope.circle.radius = $scope.gcircle.getRadius();
    }
  }
}

这有效，但现在我正在尝试在圆的半径上添加验证器。

要做到这一点，我已经添加了一个指令（this之后），如下所示：

angular
  .module('frontend')
  .directive('radiusValidator', function () {
    return {
      require: 'ngModel',
      link: function (scope, elm, attrs, ctrl) {
        ctrl.$validators.radius = function (modelValue, viewValue) {
          return !viewValue || viewValue > 250;
        };
      }
    }
  })

验证器在加载时正确运行，但每当我更改映射中的圆圈时（因此在指令中更改了值，在表单控制器中更新它），它就不会再次运行。此外，在包含半径的输入字段中不会更改该值。

最令人惊讶的是，如果我在表单页面中添加“调试按钮”，onClick只会将vm.circle的值记录到控制台，则会在字段中更新该值并运行验证程序

我尝试添加$watch(vm.circle, <function that does the log>)，但它不起作用......

我做错了什么或错过了什么？

指令中的程序变量更改不会运行父作用域验证

0 个答案: