Ionic and angularjs Cannot read property 'scrollWidth' of null - angularjs

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. :)

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?

polymer-micro.html error:prototype.registerCallback is not a function despite of no use of iron or core element

I am using polymer 1.0.8 with angularjs through this library.and i am getting error
Uncaught TypeError: prototype.registerCallback is not a function
tried solutions mentioned in this and this link
Note: m not using any paper elements.
Note: no core or iron elements are used.m working on much simple example as a beginner.
but still m getting this error and no custom polymer element is working.please help me here.......
i don't know the reason behind it but i fixed this just by removing element's name from definition.
Polymer("x-double",{
properties:{});
to this
Polymer({
properties:{});
may be version's problem or something else...........

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

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

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.

Backbone.js model not defined in view?

I've decided that I am going to try and learn backbone.js by making a web app. This is the first time I have done anything extensive in javascript, so the answer to my problem may be right in front of my face.
I have the web app on github, along with a running version that doesn't work. The javascript console just says that something is undefined when I don't think it should be. Here's the error that chrome gives for line 30 of app.js:
Uncaught TypeError: Cannot read property 'el' of undefined
I've sort of been referencing the backbone-fundamentals example modular to-do app, and it doesn't seem to have any issues with a similar thing.
If anyone could point out what I am doing wrong, I would be most appreciative!
Thanks in advance!
Your Machine view render method was missing return this and by default all methods return undefined - that's why chaining didn't work
Edit: and a small tip:
jQuery, Underscore and Backbone register globally - and thanks to that you don't have to define them as dependencies every time - it's enough if you require them in your main script once and after that you can access them from the global scope as you normally would
In my case i was returning this without the return keyword. As i was using javascript and not coffeescript it failed on me. So, if you are using javascript use return this; instead of just this in the last line of the render() function.
I also had a problem when using this.collection.on('reset', this.render(), this). I instead had to use this.collection.on('reset', this.render.bind(this));

Resources