angular js中的自定义指令没有设置属性

properties are not setting on custom directive in angular js

本文关键字：设置 属性 指令 自定义 js angular      更新时间：2023-09-26

我在angular js中创建自定义指令。我在应用css或自定义指令类的另一种效果时出错。我想要的是，当我点击锚链接时，它会选择属性值，并给所选元素css的效果。我是angular js的新手。请帮我解决这个问题。

代码

medicalApp.directive('customModel', function($parse){
    return{
         link: function(scope, element, attrs){
             element.bind('click', function (e) {
                e.preventDefault();
               scope.hrefval=  element.attr('data-href');
                scope.hrefval.css('background-color', 'white');
            });  
        }
    }
});
<a href="javascript:void(0)" data-href="#ndcadd_bill" custom-model>
          <label><i class="fa fa fa-plus-square" aria-hidden="true"></i></label>
          <span>Add New</span> </a>
<div id="ndcadd_bill"><h1>Want to effect of css here not on link</h1></div>

浏览器显示这个属性有问题 .css('background-color', 'white');

我在angular js中创建自定义指令。我在应用css或自定义指令类的另一种效果时出错。我想要的是，当我点击锚链接时，它会选择属性值，并给所选元素css的效果。我是angular js的新手。请帮我解决这个问题。

你想在元素上而不是在属性上设置样式

scope.hrefval=  element.attr('data-href');
//scope.hrefval.css('background-color', 'white');
element.css('background-color', 'white'); //I think this is what you need

希望有帮助

使用element.css代替scope.hrefval

element.css('background-color', 'white');

下面的代码将解决您的问题

element.css('background-color', 'white');

这里是jsfiddle链接http://jsfiddle.net/Balajivaishnav/jYQc6/273/

为此，我们需要使用angular将其定义为angular元素。元素

medicalApp.directive('customModel', function($parse){
    return{
         link: function(scope, element, attrs){
             element.bind('click', function (e) {
                e.preventDefault();
               scope.hrefval=  element.attr('data-href');
                var refval= angular.element('scope.hrefval');
refval.css({
'background-color': 'white'
});
            });  
        }
    }
});
<a href="javascript:void(0)" data-href="#ndcadd_bill" custom-model>
          <label><i class="fa fa fa-plus-square" aria-hidden="true"></i></label>
          <span>Add New</span> </a>
<div id="ndcadd_bill"><h1>Want to effect of css here not on link</h1></div>
相关文章：