您可以覆盖 AngularUI Bootstrap 中的特定模板吗? [英] Can you override specific templates in AngularUI Bootstrap?
问题描述
我很好奇是否有办法覆盖 ui-bootstrap-tpls 文件中的单个特定模板.绝大多数默认模板都符合我的需求,但有几个特定模板我想替换,而无需经历获取所有默认模板并将它们连接到非 tpls 版本的整个过程.
是的,来自 http://angular-ui.github 的指令.io/bootstrap 是高度可定制的,很容易覆盖其中一个模板(并且仍然依赖于其他指令的默认模板).
提供 $templateCache
就足够了,或者直接提供它(如在 ui-bootstrap-tpls
文件中所做的那样)或者 - 可能更简单 - 使用覆盖模板 指令(doc).
我正在更改警报模板以将 x
替换为 Close
的人为示例如下所示:
<html ng-app="plunker"><头><script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.5/angular.js"></script><script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.4.0.js"></script><script src="example.js"></script><link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap-combined.min.css" rel="stylesheet"><script id="template/alert/alert.html" type="text/ng-template"><div class='alert' ng-class='type &&警报-"+类型'><button ng-show='closeable' type='button' class='close' ng-click='close()'>Close</button><div ng-transclude></div>
头部><身体><div ng-controller="AlertDemoCtrl"><alert ng-repeat="alert in alerts" type="alert.type" close="closeAlert($index)">{{alert.msg}}</警报><button class='btn' ng-click="addAlert()">添加提醒</button>