"TypeError: Cannot read property 'add' of undefined" error with ng-animate - angularjs

After I update from 1.2.24 to 1.3.0-rc.2 I'm getting following error. When I remove ngAnimate from modules, it disappears. Only thing that uses animates is angular-ui-bootstrap.
TypeError: Cannot read property 'add' of undefined
at M (http://localhost/webapp/js/angular-animate.min.js:8:113)
at http://localhost/webapp/js/angular-animate.min.js:19:6
at http://localhost/webapp/js/angular-animate.min.js:8:29
at m.$digest (http://localhost/webapp/js/angular.min.js:116:279)
at m.$apply (http://localhost/webapp/js/angular.min.js:118:386)
at l (http://localhost/webapp/js/angular.min.js:77:80)
at u (http://localhost/webapp/js/angular.min.js:81:389)
at XMLHttpRequest.v.onreadystatechange (http://localhost/webapp/js/angular.min.js:82:477) angular.js:10627
(anonymous function) angular.js:10627
(anonymous function) angular.js:7824
m.$digest angular.js:13166
m.$apply angular.js:13380
l angular.js:8849
u angular.js:9064
v.onreadystatechange angular.js:9003
Thanks in advance for any help...
Edit:
After block by block examination, I found out that accordion causes the error. But it still works and animation is also ok. But it's annoying to have errors.

would need more infos but a solution could be
[ngAnimate]=... instead of * ngAnimate.

Related

Is there any way to handle `Cannot read property 'cards' of null` error?

I am using Embedly in React.js application to show URL preview in the page that has arrow navigation, and I am getting an error when switching page before embed content loaded.
The error message received is:
Uncaught TypeError: Cannot read property 'cards' of null
at n.done (platform.js:7)
at e.done (platform.js:8)
at e.each (platform.js:8)
at e.<anonymous> (platform.js:8)
at n.<anonymous> (platform.js:7)
at platform.js:7
at Array.forEach (<anonymous>)
at Object.e.each (platform.js:8)
at platform.js:7
at Array.forEach (<anonymous>)
Setting Chrome to pause on exceptions, and using its pretty print to make the code more easily readable, we see that the contentWindow property of parameter b is null, hence the error. However, this error is coming from the third party Platform.js, so I cannot amend that code myself to work around the issue there.
In order to recreate the issue, open this JS Fiddle. In the lower right pane you'll see the running example. Click the Next button several times very quickly, after a few attempts the error will appear in the console / Chrome will pause execution (if set to do so).
Question
Is there anything I can do in my own code to prevent this exception from occurring in platform.js?

TypeError: Cannot read property 'length' of null at JQLite.(anonymous function) at at Scope.parent.$get.Scope.$broadcast

In my project I am using angular version 1.4.6 and angular ui router version 2.15
Note : I just updated angular from 1.4.3.
Whenever I change states on my page I get below error.
Code is same I just updated angular version.
Error
TypeError: Cannot read property 'length' of null
at JQLite.(anonymous function) (http://localhost:8001/jspm_packages/npm/angular#1.4.6/angular.js:1718:22)
at Scope.parent.$get.Scope.$broadcast (http://localhost:8001/jspm_packages/npm/angular#1.4.6/angular.js:7701:32)
at Scope.parent.$get.Scope.$destroy (http://localhost:8001/jspm_packages/npm/angular#1.4.6/angular.js:7535:18)
at cleanupLastView (http://localhost:8001/jspm_packages/github/angular-ui/ui-router#0.2.15/angular-ui-router.js:3939:26)
at http://localhost:8001/jspm_packages/github/angular-ui/ui-router#0.2.15/angular-ui-router.js:3972:13
at publicLinkFn (http://localhost:8001/jspm_packages/npm/angular#1.4.6/angular.js:2976:15)
at updateView (http://localhost:8001/jspm_packages/github/angular-ui/ui-router#0.2.15/angular-ui-router.js:3962:23)
at http://localhost:8001/jspm_packages/github/angular-ui/ui-router#0.2.15/angular-ui-router.js:3924:11
at Scope.parent.$get.Scope.$broadcast (http://localhost:8001/jspm_packages/npm/angular#1.4.6/angular.js:7701:32)
at $state.transitionTo.$state.transition.resolved.then.$state.transition (http://localhost:8001/jspm_packages/github/angular-ui/ui-
I was getting the same error. Turned out to be an issue in angular-material. Are you using it? upgrading to 0.11.0-master-1a99821 fixed it for me.

Ionic and angularjs Cannot read property 'scrollWidth' of null

I have the following problem. I have two exactly the same list views, with directives inside (I use angularJS). One of them runs without any issues, however the other one throws the following error:
TypeError: Cannot read property 'scrollWidth' of null
at Object.ionic.views.Scroll.ionic.views.View.inherit.initialize.options.getContentWidth (ionic.bundle.js:4081)
at ionic.views.Scroll.ionic.views.View.inherit.resize (ionic.bundle.js:4835)
at ionic.views.Scroll.ionic.views.View.inherit.run (ionic.bundle.js:4147)
at ionic.bundle.js:39888
at ionic.bundle.js:21929
at completeOutstandingRequest (ionic.bundle.js:12022)
at ionic.bundle.js:12330ionic.bundle.js:17696 (anonymous function)ionic.bundle.js:14989 $getionic.bundle.js:21932 (anonymous function)ionic.bundle.js:12022 completeOutstandingRequestionic.bundle.js:12330 (anonymous function)
My code is pretty long, so I am not posting it yet - if there is need to do so, I will :)
HINT: I've tested the app on my phone, and it seems that I cant scroll on which the error occurs. Any suggestions?
Thanks
Ok, so I finally figured it out. I simply didnt have any div in my ion-scroll. :)

md-button inside ui-gmap-window (angular-google-maps) error

The Chrome console is throwing this error when I use a md-button in the html inside a google maps infowindow.
Error: [ngTransclude:orphan] http://errors.angularjs.org/1.3.2/ngTransclude/orphan?p0=%3Cbuttonlass%3D%22md-primary%20md-button%20md-default-theme%22%20ng-transclude%3D%22%22%20ng-click%3D%22button1callback()%22%20tabindex%3D%220%22%3E
at Error (native)
at https://code.angularjs.org/1.3.2/angular.min.js:6:416
at Ja.link (https://code.angularjs.org/1.3.2/angular.min.js:237:351)
at $ (https://code.angularjs.org/1.3.2/angular.min.js:70:46)
at I (https://code.angularjs.org/1.3.2/angular.min.js:59:251)
at g (https://code.angularjs.org/1.3.2/angular.min.js:51:299)
at g (https://code.angularjs.org/1.3.2/angular.min.js:51:316)
at https://code.angularjs.org/1.3.2/angular.min.js:50:414
at WindowChildModel.angular.module.service.buildContent (http://rawgit.com/angular-ui/angular-google-maps/master/dist/angular-google-maps.js:863:63)
at WindowChildModel.angular.module.service.createWindowOptions (http://rawgit.com/angular-ui/angular-google-maps/master/dist/angular-google-maps.js:831:29)angular.js:11383 (anonymous function)angular.js:8459 $getangular.js:8127 $angular.js:7637 Iangular.js:6993 gangular.js:6996 gangular.js:6872 (anonymous function)angular-google-maps.js:863 angular.module.service.buildContentangular-google-maps.js:831 angular.module.service.createWindowOptionsangular-google-maps.js:3355 angular.module.factory.WindowChildModel.createGWinangular-google-maps.js:3240 __bindangular-google-maps.js:3285 WindowChildModelangular-google-maps.js:6930 angular.module.factory.Window.initangular-google-maps.js:6915 (anonymous function)angular.js:12984 (anonymous function)angular.js:14200 $get.k.$evalangular.js:14016 $get.k.$digestangular.js:14238 (anonymous function)angular.js:4842 eangular.js:5215 (anonymous function)
I'm using the angular-google-maps http://angular-ui.github.io/angular-google-maps/#!/ library to use google maps with angular. In this plunker you can reproduce the error http://embed.plnkr.co/fWlFjuyuldZj6uITvWH7/preview
Do you have any idea how to fix this?
When I use a native html button it works well, but I need to use angular material.
Thanks.
The markup which you have written inside <ui-gmap-window> is getting compiled multiple times. Hence the error.
I have created a directive to not to compile the contents by the controllers scope.
Here is the updated plunker. http://plnkr.co/edit/y02RsaWBMuaiwCT0jPua?p=preview

marionette example not working

I have all the HTML , JS code here on codepen : http://cdpn.io/nbuGB
I started learning marionette JS. Somehow this simple example is not working.
It throws error :
Uncaught TypeError: undefined is not a function
how to resolve this ?
Your problem is in these lines:
ContactManager.reqres.setHandler("contact:entities",function(){
return API.getContactEntities;
});
You need to write API.getContactEntities() otherwise you're returning a function reference instead of your contacts collection. This causes the undefined error.
See: http://codepen.io/anon/pen/jALtq

Resources