从AngularJS指令获取HTML元素类

Question

我有如下所示的AngularJS代码块：

<ion-list can-swipe="true">
  <ion-item ng-repeat="item in items" simplify-item>
    <div class="row" style="background-color:orange;">
      Hello
    </div>
  </ion-item>
</ion-list>

指令来自离子框架。 不过，我仍在尝试为此添加自己的指令。 我想通过一个名为“ simplify-item”的属性来设置CSS属性。 我的实现此目的的指令如下所示：

myApp.directive('simplifyItem', function() {
  return {
    restrict:'A',
    link: function(element) {
      console.log('linking element');
      if (element === null) {
        console.log('element is null');
      } else {
    var result = element.hasClass('item-complex');
    if (result === null) {
      console.log('result is null.');
    } else {
      console.log('Sweet!');
    }
      }
    }
  };
});

当行var result = element.hasClass('item-complex'); 被执行，我得到一个例外。 异常说明：

undefined is not a function

我不明白为什么我不能这样做。 我究竟做错了什么？

Answer 1

这样尝试

myApp.directive('simplifyItem', function() {
  return {
    restrict:'A',
    link: function(scope , iElement, iAttrs) {
     var element = iElement;
      console.log('linking element');
      if (element === null) {
        console.log('element is null');
      } else {
    var result = element.hasClass('item-complex');
    if (result === null) {
      console.log('result is null.');
    } else {
      console.log('Sweet!');
    }
      }
    }
  };
});

角度文档的解释

想要修改DOM的指令通常使用link选项。 link采用具有以下签名的函数，函数link（scope，element，attrs）{...}其中：

• scope是Angular作用域对象。
• element是此伪指令匹配的jqLit​​e包装的元素。
• attrs是一个哈希对象，具有标准化属性名称及其对应的属性值的键-值对。