Question

我的UI中有一个带有ngModel的单选按钮，它通过ngDisabled启用/禁用另一个输入。

当输入元素变为启用/禁用时，我想观察/观察/触发，并且必须在Angular Service中完成。我根本找不到怎么做。以下是我将如何在指令中执行此操作：

// for the case of field that might be ng-disabled, we should skip validation
// Observe the angular disabled attribute
attrs.$observe("disabled", function(disabled) {
  if (disabled) {
    // Turn off validation when element is disabled
    cancelValidation();
  } else {
    // Re-Validate the input when enabled
    var value = ctrl.$viewValue || '';
    ctrl.$setValidity('validation', validate(value, true));
  }
});

但如何在服务中 ??? 我不希望有另一个指令，我真的希望通过该服务完成。

在提出问题之前，我发现了这个Is it possible to 'watch' attributes' changes，我试了一下

scope.$watch(function() {return element.attr('disabled'); }, function(newValue){});

但这似乎不起作用，至少在我启用/禁用我的单选按钮时（输入元素作为ngDisabled绑定到带有ngModel的单选按钮）

我还发现我们可以使用jQuery.watch（），但我想坚持使用vanilla javascript或jqLite。有可能吗？

修改
我应该提到这个服务是独立的，并且无法访问Controller，因为它是一个表单验证工具，它不知道外部（至少不超过元素本身和他的范围）。如果需要，您可以查看并使用它：Angular-Validation并且它支持指令和服务，具体取决于您希望验证发生的位置和位置，我的问题仅与服务中的代码相关。 pankajparkar的答案帮我解决了......谢谢：）

Answer 1

我相信你的属性disabled有一个类似disabled="{{disable}}"的插值，为什么你能够将$observe放在该值上尝试将相同的内容更改为$watch不能使用attribute，您还需要$interpolate服务来评估属性插值。因此，实际值将被评估为disabled或''，如果更改状态，则$watch函数将相应地被触发。

<强>代码

scope.$watch(function() {
   return $interpolate(element.attr('disabled'))(scope); //this will evaluate attribute value `{{}}``
}, function(newValue){
    //your code would be here
});

Answer 2

范围的目的是“粘合在一起”＃34;您的应用的演示文稿和业务逻辑。将$scope传递给服务没有多大意义。您可以使用此服务（与单选按钮视图关联的服务）初始化控制器时执行$scope.$watch，并触发对服务的调用以进行所需的更新。

如果您已经可以在服务中访问此变量（从控制器获取），您应该能够：

app.service('myservice',function(){
    this.listen = function($scope) {
        $scope.$watch(function(){return someScopeValue},function(){
           //$scope.dosomestuff();
        });
    }
});

//your controller

function myCtrl($scope,myservice) {
    $scope.listen = function() {
        myservice.listen($scope);
    }

    //call your method
    $scope.listen();
}

如何观察或观察AngularJS服务中的输入属性更改？

2 个答案: