在(链接)指令html中工作在a-href链接中而不在按钮
中工作您好, 我是为常见指令创建的,这里我需要3种类型(链接,按钮,图标)命令,链接指令它工作正常但按钮不起作用
var app = angular.module('testApp', ['ngSanitize']);
app.directive('comonLink', ['$http', function($http) {
return {
restrict: 'AEC',
require: '',
scope: {
setValues:'@',
},
template:'<div ng-bind-html="setValues" compile-template> </div>',
link: function(scope, iElement, iAttrs, ngModelController) {
var comonLink=iAttrs.comonLink;
var splitValues=comonLink.split(",");
if(splitValues[0]=='link'){
scope.setValues='<a href="#/'+splitValues[1]+'">'+splitValues[2]+'</a>';
}
else if(splitValues[0]=='button'){
scope.setValues='<button type="button" class="btn btn-default btn-block">'+splitValues[2]+'</button> ';
}
else if(splitValues[0]=='icon'){
} }
};
}]);
&#13;
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>testApp</title>
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<script data-require="angular.js@~1.3.15" data-semver="1.3.15" src="https://code.angularjs.org/1.3.15/angular.js"></script>
<script data-require="angular-ui-select@*" data-semver="0.13.2" src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-select/0.13.2/select.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0-rc.0/angular-sanitize.js"></script>
</head>
<body class="hold-transition skin-blue sidebar-mini" data-ng-app="testApp" >
<div class="wrapper">
<span comon-Link="link,opRegistration,LinkName,isNew"> </span>
<span comon-Link="button,opRegistration,ButtonName,isNew"> </span>
</div>
</body>
</html>
&#13;
答案 0 :(得分:1)
将此过滤器添加到您的应用
app.filter('unsafe', function ($sce) {
return function (val) {
return $sce.trustAsHtml(val);
};
});
并像这样使用
var app = angular.module('testApp', ['ngSanitize']);
app.directive('comonLink', ['$http', function($http) {
...
template:'<div ng-bind-html="setValues| unsafe" compile-template> </div> <span> {{ setValues1 }}</span>',
...
};
}]);