Bootstrap UI Angular Accordion 和 Rails 模板必须有一个根元素答案

【问题标题】：Bootstrap UI Angular Accordion and Rails template must have one root elementBootstrap UI Angular Accordion 和 Rails 模板必须有一个根元素
【发布时间】：2014-09-21 19:40:45
【问题描述】：

我正在尝试在我的 rails 应用程序中使用示例手风琴指令，但收到以下错误并且我的浏览器崩溃

Template for directive 'accordionGroup' must have exactly one root element.  
template/accordion/accordion-group.html

我的 HTML 视图与示例手风琴相同（此处缩短了可读性）

<div ng-controller="AccordionDemoCtrl">

  <accordion close-others="oneAtATime">
    <accordion-group heading="Static Header, initially expanded" is-open="status.isFirstOpen" is-disabled="status.isFirstDisabled">
      This content is straight in the template.
    </accordion-group>
    <accordion-group heading="{{group.title}}" ng-repeat="group in groups">
      {{group.content}}
    </accordion-group>
  </accordion>
 </div>

我的路线：

angular
  .module('App', [
    'ngRoute',
    'templates',
    'ui.bootstrap'
  ])
    .when('/page', {
      templateUrl: 'page.html',
      controller: 'PageCtrl'
    })
    $locationProvider.html5Mode(true);
  });

我也在使用角度模板 gem，但不确定这是否与它有关。

【问题讨论】：

能否请您添加您的AccordianDemoCtrl 和相关状态？
你能设置一个plunker吗...

标签： ruby-on-rails angularjs angular-ui-bootstrap

【解决方案1】：

我在使用 angular bootstrap 时遇到了类似的错误，这是由于使用了

ui-bootstrap.js 而不是ui-bootstrap-tpls.js

【讨论】：

【解决方案2】：

可能是手风琴模板文件中的 BOM 导致了问题。

在允许您更改编码（如 Notepad++）的文本编辑器中打开文件，将文件更改为不带 BOM 的 UTF-8 并保存。那应该可以解决它（假设这是问题！）。

【讨论】：