16

<div>我试图在我的网页上使用 twitter bootstrap popover，但发现它在with下方时不起作用ng-repeat。它在不包含的 div 类的顶部运行良好，ng-有人知道它为什么会发生，我该如何解决这个问题？ 

<h3>Students Without Team</h3>
 <div class="accordion" id="studentNoTeamAccordion" >
         <a href="#" class="btn btn-large btn-primary" rel="popover"data-html="true"
            data-content="
               <form>
                   <textarea class='input-xlarge' rows='12' type='text'></textarea>  
                   <P>
                      <input class='btn btn-primary' type='submit' value='Send' />
               </form>"
            data-placement="right" data-original-title="Enquiries">Send Enquiries
        </a>
  <div class="accordion-group" ng-repeat="(key,val) in stud_finding"><
      <a href="#" class="btn btn-large btn-primary" rel="popover"data-html="true"
         data-content="
               <form>
                   <textarea class='input-xlarge' rows='12' type='text'></textarea> 
                   <P>
                       <input class='btn btn-primary' type='submit' value='Send' />
               </form>"
4

2 回答 2

11

我不明白为什么这个问题被否决了。这是关于如何理解角度范围原理的一个很好的例子。范围基本上附加到 DOM 元素。所有的控制器、重复等都只能在这个 DOM 元素（范围）中工作。当 Boostrap 创建一个弹出框时，它会创建一个新的 DOM 元素并将其附加到 body，所以现在它超出了范围（它不再在元素中）。这是了解 Angular 的一个关键特性。

幸运的是，Bootstrap 有解决方案。Popover 有一个container选项，可让您将弹出框附加到特定元素而不是正文。将具有角度控制器的 DOM 元素的 jQuery 选择器放在那里。http://twitter.github.io/bootstrap/javascript.html#popovers（见选项）

于 2013-06-24T00:52:32.100 回答
6

目前至少有 2 个项目已经为 AngularJS 编写了 Bootstrap 的 popover 指令：

不同之处在于http://angular-ui.github.com/bootstrap/是原生 AngularJS 指令，因此您不需要任何第三方 JavaScript 依赖项。

这两个项目都托管在 GitHub 上，因此您可以查看实现并从中学习、决定更改或仅使用其中一个项目。

于 2013-02-16T11:21:21.533 回答