简体   繁体   中英

$injector:modulerr error in angularjs (angular-ui-router)

I am trying to load a template with ui-router in angular js. These are my html and js files.

   <!DOCTYPE html>
<html>
    <head>     
        <title>AngularJS UI Routing</title>
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> 
    </head>
    <body ng-app="app">
        <a href='#/first-msg'>link</a>
        <div ui-view></div>

        <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.3/angular.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.4.2/angular-ui-router.js"></script>
        <script src="application.js"></script>
    </body>

</html>

application.js

   var app = angular.module('app', []);
app.config(['$stateProvider', function($stateProvider) {
    $stateProvider.state('firstMessage', {
        url: '/first-msg',
        template: '<strong>hi this is 1st message</strong>'
    });
}])

You need to inject ui.router to the module,

   var app = angular.module('app', [ui.router]);

DEMO

 var app = angular.module('app', ['ui.router']); app.config(['$stateProvider', function($stateProvider) { $stateProvider.state('firstMessage', { url: '/first-msg', template: '<strong>hi this is 1st message</strong>' }); }]) 
 <!DOCTYPE html> <html> <head> <title>AngularJS UI Routing</title> <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css"> </head> <body ng-app="app"> <a href='#/first-msg'>link</a> <div ui-view></div> <script src="https://code.jquery.com/jquery-3.2.1.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.3/angular.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.4.2/angular-ui-router.js"></script> </body> </html> 

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM