Angular UI Bootstrap аккордеон не работает, если добавить зависимость..?

Я скопировал примеры для Angular UI accordion со многих сайтов, но ни один код не работает. Когда я использую этот код plunker или что-то подобное, он работает, но не работает на моем компьютере. Пожалуйста, помогите мне.

Это мой HTML-код

<!DOCTYPE HTML>
<html lang="en-US" ng-app="myModule">
<head>
  <meta charset="UTF-8">
  <title>Accordion test</title>
  <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.0.5/angular.min.js"></script>
  <script type="text/javascript" src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.4.0/ui-bootstrap-tpls.min.js"></script>
  <script type="text/javascript" src="example.js"></script>
  <link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet">
</head>
<body>
<div ng-controller="AccordionDemoCtrl">
  <label class="checkbox">
    <input type="checkbox" ng-model="oneAtATime">
    Open only one at a time
  </label>

  <accordion close-others="oneAtATime">
    <accordion-group heading="Static Header">
      This content is straight in the template.
    </accordion-group>
    <accordion-group heading="{{group.title}}" ng-repeat="group in groups">
      {{group.content}}
    </accordion-group>
    <accordion-group heading="Dynamic Body Content">
      <p>The body of the accordion group grows to fit the contents</p>
        <button class="btn btn-small" ng-click="addItem()">Add Item</button>
        <div ng-repeat="item in items">{{item}}</div>
    </accordion-group>
  </accordion>
</div>

</body>
</html>

и это код JS

angular.module('myModule', ['ui.bootstrap'])

function AccordionDemoCtrl($scope) {
  $scope.oneAtATime = true;

  console.log('bla');

  $scope.groups = [
    {
      title: "Dynamic Group Header - 1",
      content: "Dynamic Group Body - 1"
    },
    {
      title: "Dynamic Group Header - 2",
      content: "Dynamic Group Body - 2"
    }
  ];

  $scope.items = ['Item 1', 'Item 2', 'Item 3'];

  $scope.addItem = function() {
    var newItemNo = $scope.items.length + 1;
    $scope.items.push('Item ' + newItemNo);
  };
}

Заранее спасибо..

Источник

1 ответ

Решение

Похоже, вы не прикрепляете свой AccordionDemoCtrl контроллер к вашему myModule модуль. Вам нужно что-то вроде этого:

 angular.module('myModule').controller("AccordionDemoCtrl", AccordionDemoCtrl);

Поместите эту строку под (или выше) текущим определением для AccordionDemoCtrl и это должно исправить вещи для вас.

Источник
Другие вопросы по тегам