且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

包括角UI引导警报链接?

更新时间:2023-12-03 09:37:52

在AngularJS前pression嵌入HTML标记通常不是因为这样你将不能够评估AngularJS指令的***途径。

不管怎样,回到你的问题 - 大约有你的问题得到的许多方面。如果你只是显示链接最简单的方法去将是使用 NG-绑定-HTML 指令之后(http://docs.angularjs.org/api/ngSanitize.directive:ngBindHtml):

 <警报NG重复=警戒警报中TYPE =alert.type亲密=closeAlert($指数)>
    <跨度NG绑定-HTML =alert.msg>< / SPAN>
  < /警报>

工作普拉克:http://plnkr.co/edit/Ftab0xtcelXcHSZbFRxs?p=$p$pview

How do I include links in an angular-ui bootstrap alert?

Attempt:

Plunker Example

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