Getting an error when adding modules to Angular app: Uncaught Error: [$injector:modulerr]

Question

When no modules are added, everything works for the page using controller 'articles', when adding modules needed the page needing controller 'flow' everything works in flow, but 'articles' gives me this error.

var AC = angular.module('AC', ['ngRoute','ngMaterial','firebase'])

AC.controller('articles', function($scope){...})

AC.controller('flow', function($scope,$firebaseArray) {...}

My scripts:

<!-- START STYLE AND SCRIPTS -->    
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>     
    <!-- Angular Material requires Angular.js Libraries -->
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-animate.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-aria.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-messages.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0rc1/angular-route.min.js"></script>
    <script src="https://cdn.firebase.com/libs/angularfire/2.3.0/angularfire.min.js"></script>
    <!-- Angular Material Library -->
    <script src="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.0/angular-material.min.js"></script>
<!-- END STYLE AND SCRIPTS -->

I addded the ngRoute module, it didn't work. Then I tried using the normal angular.js file as it apparently gives a specific error, didn't work as well.

Any help?

Try AC.controller('articles',['$scope', function($scope){...}]) declaration — gh9
– gh9, Commented Jan 26, 2018 at 20:18
Thanks for responding! Unfortunately it still gives the same error. — Arne Verster
– Arne Verster, Commented Jan 26, 2018 at 20:24

Sajeetharan · Accepted Answer · 2018-01-26 20:23:54Z

Try this order with the mathcing versions of angular-route and angular-fire

   <!-- Angular -->
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
        <!-- Angular Route -->
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular-route.min.js"></script>
        <!-- Angular Material Dependencies -->
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.6/angular-animate.min.js"></script>
        <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.6/angular-aria.min.js"></script>
        <!-- Angular Material -->
        <script src="https://ajax.googleapis.com/ajax/libs/angular_material/0.8.2/angular-material.min.js"></script>
        <!-- Firebase -->
        <script src="https://cdn.firebase.com/js/client/2.2.2/firebase.js"></script>
        <!-- AngularFire -->
        <script src="https://cdn.firebase.com/libs/angularfire/1.0.0/angularfire.min.js"></script>
        <!-- our own app scripts -->
        <script src="js/concat/app.js"></script>

Arne Verster · Accepted Answer · 2018-01-26 20:32:43Z

0

Apologies for this question. The libraries were added on the flow.html file but not on the article.html file. The two solutions I provided at the bottom of the question does work as answered in previous questions.

answered Jan 26, 2018 at 20:32

Arne Verster

498 bronze badges

Collectives™ on Stack Overflow

Getting an error when adding modules to Angular app: Uncaught Error: [$injector:modulerr]

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related