我有一个通过 API 调用自动生成的元素,如下所示
<a target="_blank" href="http://www.work.com/reward"><b class="orange tdu">My Work History</b></a>
现在我想修改它,就像
<a ng-click="message(messageItem.id)">
即我想删除原始属性并向其添加 Angular ng-click。
我无法使用 JQuery。
最佳答案
在你的 Controller 中尝试这样。
1:选择元素并使用
删除不需要的属性element.removeAttribute("目标"
);
2:使用元素添加必需的属性
element.setAttribute('ng-click', 'loadMicrosite(messageItem.id)'); '' you can use string concatenation for messageItem.id
3:现在 DOM 中已经有了更新的元素,但它尚未附加到范围。使用 $compile 来完成它。根据 Angular 文档 $compile
将 HTML 字符串或 DOM 编译到模板中并生成模板函数,然后可以使用该函数将作用域和模板链接在一起。
https://docs.angularjs.org/api/ng/service/ $编译
var app = angular.module('app', []);
app.controller('mainCtrl', function ($scope,$compile) {
var sNew = document.querySelector('a');
sNew.removeAttribute("target");
sNew.removeAttribute("href");
sNew.setAttribute('ng-click', 'loadMicrosite(messageItem.id)');
$compile(sNew)($scope);
$scope.loadMicrosite = function(param)
{
alert("I am called");
}
});
<!DOCTYPE html>
<html ng-app="app">
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.7/angular.min.js"></script>
</head>
<body ng-controller="mainCtrl">
<a target="_blank" href="http://sprintweb.abc.com/sos-children-s-villages-of-india-new-delhi-delhi"><b class="orange tdu">SOS Children's Villages of India</b></a>
</body>
</html>
关于javascript - 如何更改 Angular 中 html 元素的属性?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41244892/