CODEWITHSUNDEEP
angularjsangular-ui-bootstrap
Kartik Arora
Kartik Arora

Reputation: 31

Angular JS- ui.bootstrap.collapse not working properly

I am using Angular-ui Bootstrap for my application. I am trying to use the collapse property of angular-ui bootstrap.

I am doing the same as shown in the example on this site in the collapse part. But i am not getting what is wrong i am doing in my code that this is not working properly.

This is the snippet from my code 

<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>

While running this code it is giving the following error

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

as well as the follwing error

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

Please help me get the wrong i am doing in the code. Any help will be appreciated.... Thanks.

Upvotes: 1

Views: 873

Answers (1)

Kartik Arora
Kartik Arora

Reputation: 31

I got the solution to my question. The problem was that i was using an older version of Angular JS(version 1.2.X). The UI bootstrap does not support this version. As soon as i updated my project with the latest version of Angular JS(version 1.4.3) the code start to work for me.

NOTE:- Requires version 1.3.X at least to make Angular UI-Bootstrap work for your code.

Upvotes: 1

Related Questions