Question

我正在使用Angular UI Bootstrap http://angular-ui.github.io/bootstrap/。我有两个问题：

我按照 angular-ui.github.io 中给出的示例，在那里使用
```
<script src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.10.0.js">
```
但我不想使用CDN，所以我下载了Angular UI并将其添加到我的项目中。如何将其包含在我的代码中？我添加了 ['ui.bootstrap'] angular.module到我的<tabset>，但在我添加上述脚本代码之前它无效。
我正在使用document.getElementByTagName()创建两个标签，联系人和群组。对于例如，用户在“组”选项卡中，他想要将成员添加到现有组，因此如果他单击“添加成员”按钮，我想自动导航到“联系人”选项卡。

我想过在我的内心使用{{1}} 控制器。它会起作用吗？什么是Angular点击方式以编程方式。

Answer 1

浏览器可能未加载脚本文件。您必须添加一个脚本标记，指向文件在项目中的位置。例如，如果脚本放在文件夹/scripts/lib/：

中

<script src="/scripts/lib/ui-bootstrap-tpls-0.10.0.js" />

AngularJS的一个高尔夫规则是，不会出于任何原因从控制器引用DOM（即HTML元素）。因此，虽然document.getElementByTagName（）将技术上工作，但我会反对它。

在角度方面，你真的不会以编程方式点击事物。常见的方法是将HTML中的某些内容绑定到$scope中的变量，或者用大括号（{{someVariable}}），或者通过ng-class，ng-bind等指令绑定然后在$scope中更改该变量，并更改HTML以反映该变量。 $scope中是否有变量确定哪个标签打开？如果是这样，你可以改变那个变量，它应该自动运行。

Answer 2

问题＃1：

<script src="folder_of_js/ui-bootstrap-tpls-0.10.0.js"></script>

问题＃2：

如果您想要在另一个标签的内容中导航到选项卡，则不要将document.getElementByTagName()与AngularJS一起使用，示例可能如下：

<tabset>
   <tab ng-repeat="tab in tabs" heading="{{tab.title}}">
      {{tab.content}}
      <button class="btn btn-default btn-sm" ng-click="tabs[2].active = true">Select third tab</button>
   </tab>
</tabset>

正如您在此plunker中所看到的，我添加了一个按钮，只要您点击它就会导航到第三个标签。

如何使用Angular单击特定选项卡以及如何在代码中包含Angular UI

2 个答案: