AngularJS Uncaught Error injector modulerr Failed to instantiate module

Question

I am new to AngularJS and working my way through some documents and tutorials to learn  My question is in reference to Egghead s video series  this video in particular  demonstrating how to put together a basic search filter   I wanted to use this in a real app I m building for a friend with a small candle-making business but when I modified it to be her candles rather than the Avengers cast  as demo d in the video  I got this error   Uncaught Error    injector modulerr  Failed to instantiate module myApp due to  Error    injector nomod  Module  myApp  is not available  You either misspelled the module name or forgot to load it  If registering a module ensure that you specify      I copied a redacted  only 3 cast members in the array  version of EXACTLY what is in the video demo into a jsfiddle and discovered it still yields the same error    For reference  the Egghead demo is here  http   www thinkster io angularjs ET1iee6rnm angularjs-ngfilter    I ve read at least a half dozen similar questions on this site so far and tried every solution offered  but none of them get rid of this error or cause the Avengers search -- which works fine in the video demo -- to actually function properly  HTML   lt div ng-app  quot myApp quot  gt       lt div ng-controller  quot AvengersCtrl quot  gt           lt input type  quot text quot  ng-model  quot search   quot    gt           lt table gt               lt tr ng-repeat  quot actor in avengers cast   filter search quot  gt                   lt td gt   actor name   lt  td gt                   lt td gt   actor character   lt  td gt               lt  tr gt           lt  table gt       lt  div gt   lt  div gt   Javascript  var myApp   angular module  myApp        myApp factory  Avengers   function          var Avengers           Avengers cast                       name   quot Robert Downey Jr  quot           character   quot Tony Stark   Iron Man quot                                name   quot Chris Evans quot           character   quot Steve Rogers   Captain America quot                               name   quot Mark Buffalo quot           character   quot Bruce Banner   The Hulk quot                       return Avengers      function AvengersCtrl  scope  Avengers         scope avengers   Avengers     Simply put  can someone offer a solution that will work and get rid of this error  as well as explain in simple English  not Ph D  level  quot Angular Obscurese quot   what causes it  in a nutshell  and what needs to be done to avoid it  Edit  Apologies  but the jsfiddle link referenced above from the tutorial is no longer active  I have removed the broken link  The tutorial mentioned is still available for viewing

User · Answer

I had to change the js file  so to include  function    at the beginning of it  and also      at the end line  That solved the problem

User · Answer

it turns out that I got this error because my requested module is not bundled in the minification prosses due to path misspelling      so make sure that your module exists in minified js file  do search for a word within it to be sure

User · Answer

You have to play with JSFiddle loading option     set it to  No wrap - in body  instead of  onload   Working fiddle   http   jsfiddle net zQv9n 1

User · Answer

For people who find this old posting on the web by searching for the error message  there is another possible cause of the problem     You could just have a typo in your call to the script  even if you have already done the things described in the other excellent answer   So check to make sure you can used the right spelling in your script tags

User · Answer

Try using No Wrap - In Head or No wrap - in body in your fiddle    Working fiddle  http   jsfiddle net Q5hd6   Explanation   Angular begins compiling the DOM when the DOM is fully loaded  You register your code to run onLoad  onload option in fiddle     it s too late to register your myApp module because angular begins compiling the DOM and angular sees that there is no module named myApp and throws an exception   By using No Wrap - In Head  your code looks like this    lt head gt        lt script type  text javascript  src    cdnjs cloudflare com ajax libs angular js 1 2 1 angular js  gt  lt  script gt        lt script type  text javascript  gt          Your script       lt  script gt    lt  head gt    Your script has a chance to run before angular begins compiling the DOM and myApp module is already created when angular starts compiling the DOM

User · Answer

For people having the same error with a similar code     function        var app   angular module  myApp             app controller  myController   function                   Removing the   function            solved the error

[angularjs] AngularJS: Uncaught Error: [$injector:modulerr] Failed to instantiate module?

Examples related to angularjs

Examples related to jsfiddle

Examples related to angularjs-module