如何获取 HTML 元素的变量属性？

Question

我有一个 ng-repeat，我在其中设置了一个属性，如下所示：

<div ng-repeat="item in itemsList"
     stepType="{{item.stepType}}">
     {{item.itemValue}}
</div>

item.stepType 可以有值 'task' 或 'action' 我正在尝试像这样获取属性 'stepType'：

let stepType = el.getAttributeNode("stepType");
console.log(stepType.value);

我得到的结果是：

{{item.stepType}}

但预期结果是task或action

我也尝试使用函数 getAttribute() 获取属性，但结果是一样的。

我还注意到，在上面的代码中，如果我记录 stepType 而不是 stepType.value 的值，我得到的对象看起来像这样 stepType: 'task'

如何获得期望值？

Answer 1

尝试删除双引号。替换这个

<div ng-repeat="item in itemsList"
     stepType="{{item.stepType}}">
     {{item.itemValue}}
</div>

和

<div ng-repeat="item in itemsList"
     stepType={{item.stepType}}>
     {{item.itemValue}}
</div>

Answer 2

如果属性名称是normalized:

<div ng-repeat="item in itemsList"
     step-type="{{item.stepType}}">
     {{item.itemValue}}
</div>

自定义 AngularJS 指令可以 $observe 属性：

app.directive("stepType", function() {
    return {
        link: postLink
    };
    function postLink(scope, elem, attrs) {
        attrs.$observe("stepType", function(value) {
            console.log(value);
        });
    }
})

控制台将记录对属性的内插值的更改。

如何获取 HTML 元素的变量属性？

How to get a variable attribute of an HTML element?

html

javascript

jquery

angularjs

angularjs-ng-repeat