0

new to angularJs here. Need to work out a angular web app with flot chart. But the following gave me an error: Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.2.18/$injector/modulerr?p0=app&p1=Error%3A%20…dflare.com%2Fajax%2Flibs%2Fangular.js%2F1.2.18%2Fangular.min.js%3A18%3A139) (seen from chrome developer console).

Briefly checked out the answers to the similar questions but didn't work out. Any ideas? Thanks.

Here is the jsFiddle link.

<body ng-app="myApp" id="container">
    <chart id="chart-placeholder" ng-model='data4' class="fl"  style="position: absolute;"/>
</body>
packetie
  • 4,839
  • 8
  • 37
  • 72

1 Answers1

0

Your fiddle is not configured correctly. Change the Frameworks and Extentions from onLoad to No wrap - in head.

What looks to be happening is that the fiddle is loading and running Angular before it has loaded your own javascript. So Angular starts, sees the ng-app directive in your html, tries to find the app myApp so that it can inject it, but if doesn't exist yet since your code has not yet been loaded. So it crashes with an injector error.

And since I have your attention! Try to avoid using jQuery selectors in your directives (or anywhere in Angular). It's easy when learning Angular to slip into old habits, but they can be really destructive for your code. See this question for some good info about how to move from jQuery to Angular.

Of course, when implementing a jQuery directive you can't always avoid jQuery selectors, but it's something to keep in mind.

Community
  • 1
  • 1
Erik Honn
  • 7,576
  • 5
  • 33
  • 42
  • Thanks @Erik Honn, I did that and now I saw errors `Error: Invalid dimensions for plot, width = 0, height = 0` on developer console. My browser shows blank as a result. – packetie May 10 '15 at 16:15
  • Unfortunately I can't help you there. Those errors originate from the jQuery flot plugin, that I know nothing about. My guess is that the error code is pretty accurate, you are trying to create a plot with 0 size, and that is not allowed. – Erik Honn May 10 '15 at 16:20
  • Getting the error `Error: Invalid dimensions for plot, width = 0, height = 0` is a step forward :-) it at least means angularjs side is ok. I tried to translate the code in jsFiddle to my html file, but it gave me the angularjs error again (reported in this question). Can you check what could be wrong? Here is the link to plunker: http://plnkr.co/edit/WqGtpoR1PMSh6iEgyPmV?p=preview – packetie May 10 '15 at 16:40
  • You have misspelled myapp in your ng-app directive (it says mympp). You also have an additional ng-app directive on your html tag that you probably didn't intend to have there. That seems to solve it! – Erik Honn May 10 '15 at 19:17