Question

我有一个通过我的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)">

即我想删除原始属性并添加角度ng-click。

我不能使用JQuery。

Answer 1

在您的控制器中尝试这样。

1：选择元素并使用

删除不需要的属性

element.removeAttribute("target"）;

2：使用

在元素上添加必需属性

element.setAttribute('ng-click', 'loadMicrosite(messageItem.id)'); '' you can use string concatenation for messageItem.id

3：现在你在DOM中有了更新的元素，但它还没有附加范围。使用$ compile。根据angular docs $ 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>

Answer 2

您可以从api获取html并使用window.open

打开该页面

在html中：

<a ng-click="loadMicrosite(messageItem.id)">
   <b class="orange tdu">SOS Children's Villages of India</b>
</a>

在控制器中：

$scope.loadMicrosite = (id) ->
  url = getStringOfUrlFromServer
  window.open(
  url,
  '_blank');

如何在角度中更改html元素的属性？

2 个答案: