0

我正在使用带有 AngularJS 和 Jade 的UI Boostrap ( http://angular-ui.github.com/bootstrap )。我无法在加载该部分时选择动态生成的集合中的第一个选项卡。这是我的代码:

div#attachments-section
   tabs
      pane(ng-repeat='attach in attachments', heading='{{attach.filename}}', active='attach.active')
         div.content
            object(width='100%', height='100%', data='{{"http://localhost/files/" + attach.content}}')

这意味着,当加载部分 (#attachments-section) 时,没有选择任何选项卡。我尝试为 JSON 集合(附件)的第一个元素中的 active 属性分配一个真实值,但它不起作用。

检查:我已经更新了我的代码(带有对象标签),因为我需要使用 PDF 的浏览器查看器显示每个附件。

更新我遵循了@blesh 的建议,我意识到它在 Firefox 中运行良好,但在 Chrome 中运行良好。我在 Punkler 中写了一个示例。

http://plnkr.co/edit/ESBWciLAKJosK2u6eZVD?p=preview

你知道会发生什么吗?

4

1 回答 1

0

我找到了!在 Chrome 中,您必须在对象标记中指定嵌入内容的类型。

    <div ng-controller="MainCtrl">
    <div><h2>Example</h2></div>
    <div id="attachments-section">
      <tabs>
          <pane ng-repeat="attachment in attachments" heading="{{attachment.title}}" active="attachment.active">
            <div style="height: {{objHeight}}; overflow-y: hidden;">
              <object type='application/pdf' width='100%', height='100%', data='{{attachment.filename}}'></object>
            </div>
          </pane>
      </tabs>
    </div>
</div>

现在 punkler 中的这段代码适用于任何浏览器:http: //plnkr.co/edit/ESBWciLAKJosK2u6eZVD

谢谢你的帮助。

于 2013-03-08T20:55:25.440 回答