如何使用UI Bootstrap？

我一直在寻找互联网如何使用AngularJS UI引导，但我不会努力。如何使用UI Bootstrap？

这是我的代码现在：

<html> 
<head> 
<script src="componenten/bower_components/angular/angular.js"></script> 
<script src="componenten/bower_components/angular-bootstrap/ui-bootstrap-tpls.min.js"></script> 
<script src="componenten/bower_components/angular-bootstrap/ui-bootstrap.min.js"></script> 
</head> 
<body ng-app="ui.bootstrap.demo"> 
<div ng-controller="ModalDemoCtrl"> 
    <script type="text/ng-template" id="myModalContent.html"> 
     <div class="modal-header"> 
      <h3 class="modal-title">I'm a modal!</h3> 
     </div> 
     <div class="modal-body"> 
      <ul> 
       <li ng-repeat="item in items"> 
        <a href="#" ng-click="$event.preventDefault(); selected.item = item">{{ item }}</a> 
       </li> 
      </ul> 
      Selected: <b>{{ selected.item }}</b> 
     </div> 
     <div class="modal-footer"> 
      <button class="btn btn-primary" type="button" ng-click="ok()">OK</button> 
      <button class="btn btn-warning" type="button" ng-click="cancel()">Cancel</button> 
     </div> 
    </script> 
    <button type="button" class="btn btn-default" ng-click="open()">Open me!  </button> 
    <button type="button" class="btn btn-default" ng-click="open('lg')">Large modal</button> 
    <button type="button" class="btn btn-default" ng-click="open('sm')">Small modal</button> 
    <button type="button" class="btn btn-default" ng-click="toggleAnimation()">Toggle Animation ({{ animationsEnabled }})</button> 
    <div ng-show="selected">Selection from a modal: {{ selected }}</div> 
    </div> 
</body> 
</html>

我已经尝试添加几乎每个脚本和CSS文件，但它不会有任何效果。

来源

2015-09-07 SjaakvBrabant

您需要包括角引导作为一个依赖：

angular.module('ui.bootstrap.demo', ['ui.bootstrap']);

并请删除ui-bootstrap.min.js怎么一回事，因为ui-bootstrap-tpls.min.js同时包含代码和模板。

来源

2015-09-07 11:58:43

欧凯是固定了大量已经，没有更多的错误，当我开始页面，但是当我点击一个按钮，我再次出现错误。 – SjaakvBrabant

什么样的错误？ –

这是在控制台所示的误差“[$编译：tpload]未能加载模板：模板/模态/ window.html（HTTP状态：404未找到）” – SjaakvBrabant

如何使用UI Bootstrap？

回答

相关问题