Fatal编程技术网
  • angularjs/
  • AngularJS只获取插入的指令属性名称

AngularJS只获取插入的指令属性名称

angularjs

AngularJS只获取插入的指令属性名称,angularjs,angularjs-directive,angularjs-google-maps,Angularjs,Angularjs Directive,Angularjs Google Maps,我创建了， 该指令不监视任何属性值，因为属性名称是动态的（太多情况） 但是，我希望仅当指令用户使用双花括号将属性值设置为动态时，才将$observe应用于attribute 我已经尝试使用compile函数和link函数来检测用户是否使用了双曲括号，但还没有成功 要解释，请从以下代码 <body ng-app="myApp" ng-controller="MyCtrl"> <div my-dir foo="{{foo}}" bar="bar"></div

我创建了，
该指令不监视任何属性值，因为属性名称是动态的（太多情况）

但是，我希望仅当指令用户使用双花括号将属性值设置为动态时，才将$observe应用于attribute

我已经尝试使用
compile
函数和
link
函数来检测用户是否使用了双曲括号，但还没有成功

要解释，请从以下代码

  <body ng-app="myApp" ng-controller="MyCtrl">
    <div my-dir foo="{{foo}}" bar="bar"></div>
  </body>
我的问题是如何通过AngularJS检测属性值是否是动态的？

您可以通过
elem.attr（）
获取元素本身的属性值来检查非插值值

app.directive('myDir', function() {
  return function(scope, elem, attr) {
    var regex = /{{.*}}/;

    if(regex.test(elem.attr('foo'))) {
      attr.$observe('foo', function(value) {
        // observe
        console.log('observing foo');
      });
    }

    if(regex.test(elem.attr('bar'))) {
      attr.$observe('bar', function(value) {
        // observe
        console.log('observing bar');
      });
    }

  }
});

app.directive('myDir', function() {
  return function(scope, elem, attr) {
    var regex = /{{.*}}/;

    if(regex.test(elem.attr('foo'))) {
      attr.$observe('foo', function(value) {
        // observe
        console.log('observing foo');
      });
    }

    if(regex.test(elem.attr('bar'))) {
      attr.$observe('bar', function(value) {
        // observe
        console.log('observing bar');
      });
    }

  }
});