我想在Angular.js中创建新元素
<link url="http://google.com">google</link>
将转换为<a>
代码,我该怎么做?
到目前为止的代码:
var app = angular.module('app', []);
app.directive('link', function() {
return {
restrict: 'E',
transclude: true,
replace: true,
scope: false,
template: '<a href="" ng-transclude></a>';
}
});
但它在链接后呈现谷歌,我不知道如何获取网址。
答案 0 :(得分:3)
您可以在链接功能中获取它。你的指令看起来像这样:
app.directive('link', function() {
return {
restrict: 'E',
transclude: true,
replace: true,
scope: false,
template: '<a href="{{url}}" ng-transclude></a>',
link: function(scope, element, attrs) {
scope.url = attrs.url;
}
}
});
如果你可以为你的指令创建一个独立的范围,你也可以这样做:
app.directive('link', function() {
return {
restrict: 'E',
transclude: true,
replace: true,
scope: {
url: '@'
},
template: '<a href="{{url}}" ng-transclude></a>'
}
});
然后url属性将自动放入指令的范围内。