Javascript AngularJS指令中处理范围值的惯用方法是什么?
我不太清楚怎么做。基本上,我有一个自定义消息指令作为一个元素,它的作用域中有几个字段,其中包括包含文本的内容字段。文本可以包含以http/https开头的URL和以和空格分隔的哈希标记Javascript AngularJS指令中处理范围值的惯用方法是什么?,javascript,angularjs,angularjs-directive,angularjs-scope,Javascript,Angularjs,Angularjs Directive,Angularjs Scope,我不太清楚怎么做。基本上,我有一个自定义消息指令作为一个元素,它的作用域中有几个字段,其中包括包含文本的内容字段。文本可以包含以http/https开头的URL和以和空格分隔的哈希标记 处理$scope.content以便将所有链接和哈希标记转换为超链接的惯用方法是什么?我不太清楚转换为超链接是什么意思,但假设将内容拆分为字符串数组。然后可以将其附加到链接函数中的元素: link: function($scope, iElm, iAttrs, controller) { var link
处理$scope.content以便将所有链接和哈希标记转换为超链接的惯用方法是什么?我不太清楚转换为超链接是什么意思,但假设将内容拆分为字符串数组。然后可以将其附加到链接函数中的元素:
link: function($scope, iElm, iAttrs, controller) {
var links = iElem.text().split(",");
for (var i = 0; i < links.length; i++) {
iElem.append("<a href='" + links[i] + "'>" + links[i] + "</a>");
};
$compile(iElm.contents())($scope);
}
实现这一点的最简单方法是使用指令,因为angular的$sce严格的html上下文转义和绑定 下面是我将如何着手的:
检查linky过滤器:虽然它不是我所做的,而是使用过滤器,但它是一种不那么惯用的公平方法。
var linkTemplate = _.template('<a href="<%= link %>"><%= link %></a>');
linkTemplate(links[i]);
angular.module('myModule').directive('content', function () {
return {
scope: {
text: '@'
},
link: function (scope, element, attrs) {
var urlRegex = /((https?|ftp):\/\/(-\.)?([^\s\/?\.#-]+\.?)+(\/[^\s]*)?$)/g,
urlReplacer = '<a href="\$1">\$1</a>',
hashtagRegex = /#([0-9A-z_]*[A-z_]+[A-z0-9]*)/g,
hashtagReplacer = '<a href="https://twitter.com/search/?q=%23\$1">#\$1</a>';
scope.$watch('text', function (n) {
if (n && n.length) {
var parsed = n.replace(urlRegex, urlReplacer);
parsed = parsed.replace(hashtagRegex, hashtagReplacer);
element.html(parsed);
}
});
}
};
});