在angularjs中绑定HTML属性
在angularjs中绑定HTML属性
提问于 2014-08-28 13:21:28
我有这样的代码：
<span data-icon="{{table.addIcon || ''}}"></span>这个范围创建了一个像这样的图标：
然而，我想让开发者使用这个指令，有可能定义一个新的图标。不过，我的问题是，假设我有以下情况：
$scope.table.addIcon = ""而不是创建元素
<span data-icon=""></span> 它会创造它
<span data-icon="&#xe070;"></span>它将无法添加图标，因此没有看到以下内容：
我所拥有的是：
有什么方法可以避免将&转换为&
添加溶液
多亏了米恩索尔，解决办法是：
.directive("changeIcon", function() {
var d = document.createElement("div");
return {
restrict: "A",
link: function($scope, $ele, $attrs) {
log($attrs);
var originalIcon;
$scope.decodedIcon = $attrs.icon;
do {
originalIcon = $scope.decodedIcon;
d.innerHTML = originalIcon;
$scope.decodedIcon = d.firstChild.nodeValue;
} while (originalIcon != $scope.decodedIcon);
$attrs.$set('data-icon', $scope.decodedIcon);
}
}
})它是这样使用的：
<span change-icon icon="{{table.addIcon || ''}}"></span>回答 1
Stack Overflow用户
回答已采纳
发布于 2014-08-28 22:13:06
我创建了一个示例小提琴来测试您描述的问题，但我可能遗漏了什么。
我怀疑您看到的是&而不是&，因为视图是在服务器上编码的html。
无论哪种方式，在javascript中使用解码html实体都相当容易。考虑以下例子：
m.directive('icon', function(){
var div = document.createElement('div');
return {
scope: {
icon:'='
},
link: function($scope,$element,$attrs){
var originalIcon;
$scope.decodedIcon = $scope.icon;
do {
originalIcon = $scope.decodedIcon;
div.innerHTML = originalIcon;
$scope.decodedIcon = div.firstChild.nodeValue;
} while (originalIcon != $scope.decodedIcon);
console.log('data-icon', $scope.decodedIcon);
$attrs.$set('data-icon', $scope.decodedIcon);
}
};
});你可以到处玩，这里希望它能帮助解决你的问题。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/25549874
复制相关文章
相似问题
腾讯云开发者
