AngularJS 指令不起作用 [英] AngularJS directive is not working

查看:26
本文介绍了AngularJS 指令不起作用的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

请在我写的指令下面找到,

angular.module('netVogue.directives', []).指令('set-First-Active',函数(){返回函数(范围,元素,属性){警报('样品');element.addClass("active");};});

我已通过以下方式将此指令添加到我的模块中,

angular.module('netVogue', ['netVogue.filters', 'netVogue.services', 'netVogue.directives']);

我在我的模板中使用了以下格式的指令,

但是,我既没有看到任何警报响应,也没有添加类.有人可以帮我解决这个问题吗?由于某些依赖性,我不想使用 'ng-class',而是想为 ng-repeat 的第一个元素添加 class='active'.

任何帮助将不胜感激.提前致谢.

解决方案

当声明指令时应该有驼峰命名(setFirstActive).

请参阅有关指令的开发人员指南.

<块引用>

指令具有驼峰式命名,例如ngBind".可以通过将驼峰命名法转换为带有这些特殊字符 :、- 或 _ 的蛇形命名法来调用该指令.可选地,指令可以以 x- 或 data- 为前缀,以使其符合 HTML 验证器.以下是一些可能的指令名称的列表:ng:bind、ng-bind、ng_bind、x-ng-bind 和 data-ng-bind.

Please find below the directive which i wrote,

angular.module('netVogue.directives', []).
  directive('set-First-Active', function() {
      return function(scope, element, attrs){
          alert('sample');
          element.addClass("active");     
      };
  });

I have added this directive to my module in below way,

angular.module('netVogue', ['netVogue.filters', 'netVogue.services', 'netVogue.directives']);

I used this directive in my template in following format,

<div class="item" ng-repeat="viewPrintcampaign in viewPrintcampaigns" ng-init="first=$first" set-First-Active> 
</div>

However, i neither see any response of alert nor class is getting added. Can someone please help me with this? Due to some dependency, i don't want to use 'ng-class' but want to add class='active' for the first element of ng-repeat.

Any help would be greatly appreciated. Thanks in advance.

解决方案

When declaring directive should has camel case name (setFirstActive).

See developer guide on directives.

Directives have camel cased names such as 'ngBind'. The directive can be invoked by translating the camel case name into snake case with these special characters :, -, or _. Optionally the directive can be prefixed with x-, or data- to make it HTML validator compliant. Here is a list of some of the possible directive names: ng:bind, ng-bind, ng_bind, x-ng-bind and data-ng-bind.

这篇关于AngularJS 指令不起作用的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆