2015-07-23 5 views
1

Я использую Angular-ui Bootstrap для моего приложения. Я пытаюсь использовать свойство collapse углового-ui bootstrap.Угловой JS- ui.bootstrap.collapse не работает должным образом

Я делаю то же, что показано в примере на этом site в части коллапса. Но я не понимаю, что неправильно, я делаю в своем коде, что это не работает должным образом.

Это отрывок из моего кода

<h1>Your Connections</h1><a href="" ng-click="isCollapsed = !isCollapsed" class="button-link">Invite your friend to join you</a> 
      <div collapse="isCollapsed"> 
       <button style="float:right; margin-right: 4px; margin-top: 5px; background-color: #8AA8BD; height: 30px" ng-click="sendInvite()">Send</button> 
       <input type="text" class="well well-sm" style="float: right"> 
      </div> 

При выполнении этого кода он дает следующее сообщение об ошибке

TypeError: Cannot read property 'then' of undefined 
at e (ui-bootstrap-tpls-0.13.0.min.js:8) 
at Object.fn (ui-bootstrap-tpls-0.13.0.min.js:8) 
at Object.$get.Scope.$digest (angular.js:9831) 
at Object.$get.Scope.$apply (angular.js:10039) 
at angular.js:1127 
at Object.invoke (angular.js:3123) 
at doBootstrap (angular.js:1125) 
at bootstrap (angular.js:1140) 
at angularInit (angular.js:1091) 
at angular.js:17898(anonymous function) @ angular.js:7818$get @ angular.js:5601$get.Scope.$digest @ angular.js:9843$get.Scope.$apply @ angular.js:10039(anonymous function) @ angular.js:1127invoke @ angular.js:3123doBootstrap @ angular.js:1125bootstrap @ angular.js:1140angularInit @ angular.js:1091(anonymous function) @ angular.js:17898trigger @ angular.js:1990(anonymous function) @ angular.js:2246forEach @ angular.js:196eventHandler @ angular.js:2245 

, а также ошибки follwing

TypeError: fn is not a function 
at angular.js:11316 
at completeOutstandingRequest (angular.js:3457) 
at angular.js:3751 

Пожалуйста, помогите я ошибаюсь, что делаю в коде. Любая помощь будет оценена .... Спасибо.

+0

Проблема может быть вне фрагмента кода, который вы показываете. У вас правильно настроен модуль и контроллер, а в html установлен ng-app и ng-controller? Также вы используете переменную isCollapsed в другом месте и инициализируете ее в своем контроллере? Он работает в этом plunker http://plnkr.co/edit/6iNCnnZPXp1OpBsitmig –

+0

Спасибо за ваш ответ @Sapy. Я сделал то же самое, что и в плункере. Также я установил в своем html свой ng-app и ng-controller. Но я не понимаю, что не так в коде. –

+0

Ну, используя ссылку href = "", может возникать перезагрузка страницы при каждом нажатии на нее. Попробуйте использовать кнопку '' Также есть ли у вас куча другого кода в вашем проекте? Ошибка может быть сгенерирована где-то еще. –

ответ

1

У меня есть решение моего вопроса. Проблема заключалась в том, что я использовал более старую версию Angular JS (версия 1.2.X). Бутстрап UI не поддерживает эту версию. Как только я обновил свой проект с помощью последней версии Angular JS (версия 1.4.3), код начнет работать для меня.

ПРИМЕЧАНИЕ: - Требуется версия 1.3.X, по крайней мере, для работы с угловым UI-Bootstrap для вашего кода.