包括角UI引导警报链接? [英] Include link in angular-ui bootstrap alerts?
问题描述
我如何包括角的UI引导警报链接?
尝试:
HTML
< DIV NG控制器=AlertDemoCtrl>
<警报NG重复=警戒警报中TYPE =alert.type亲密=closeAlert($指数)> {{alert.msg}}< /警报>
<按钮类='BTN'NG点击=addAlert()>添加警报< /按钮>
< / DIV>
脚本
函数AlertDemoCtrl($范围){
$ scope.alerts = [
{类型:'错误',味精:'噢单元!改变一些事情,并尝试重新提交。 },
{类型:'成功',味精:'< A HREF =>干得好< / A>!你成功读取这个重要的警报消息。 }
]; $ scope.addAlert =功能(){
$ scope.alerts.push({味精:另一个警报!});
}; $ scope.closeAlert =功能(指数){
$ scope.alerts.splice(指数,1);
};}
在AngularJS前pression嵌入HTML标记通常不是因为这样你将不能够评估AngularJS指令的最佳途径。
不管怎样,回到你的问题 - 大约有你的问题得到的许多方面。如果你只是显示链接最简单的方法去将是使用 NG-绑定-HTML
指令之后(<一个href=\"http://docs.angularjs.org/api/ngSanitize.directive:ngBindHtml\">http://docs.angularjs.org/api/ngSanitize.directive:ngBindHtml):
&LT;警报NG重复=警戒警报中TYPE =alert.type亲密=closeAlert($指数)&GT;
&LT;跨度NG绑定-HTML =alert.msg&GT;&LT; / SPAN&GT;
&LT; /警报&GT;
工作普拉克:<一href=\"http://plnkr.co/edit/Ftab0xtcelXcHSZbFRxs?p=$p$pview\">http://plnkr.co/edit/Ftab0xtcelXcHSZbFRxs?p=$p$pview
How do I include links in an angular-ui bootstrap alert?
Attempt:
HTML
<div ng-controller="AlertDemoCtrl">
<alert ng-repeat="alert in alerts" type="alert.type" close="closeAlert($index)">{{alert.msg}}</alert>
<button class='btn' ng-click="addAlert()">Add Alert</button>
</div>
Script
function AlertDemoCtrl($scope) {
$scope.alerts = [
{ type: 'error', msg: 'Oh snap! Change a few things up and try submitting again.' },
{ type: 'success', msg: '<a href="">Well done!</a> You successfully read this important alert message.' }
];
$scope.addAlert = function() {
$scope.alerts.push({msg: "Another alert!"});
};
$scope.closeAlert = function(index) {
$scope.alerts.splice(index, 1);
};
}
Embedding HTML markup in AngularJS expression is usually not the best approach as this way you won't be able to evaluate AngularJS directives.
Anyway, coming back to your question - there are many ways of getting around your problem. If you are just after displaying links the simplest way to go would be to use the ng-bind-html
directive (http://docs.angularjs.org/api/ngSanitize.directive:ngBindHtml):
<alert ng-repeat="alert in alerts" type="alert.type" close="closeAlert($index)">
<span ng-bind-html="alert.msg"></span>
</alert>
Working plunk: http://plnkr.co/edit/Ftab0xtcelXcHSZbFRxs?p=preview
这篇关于包括角UI引导警报链接?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!