Я пытаюсь использовать ui.router вместо ngRoute, и я не могу понять, в чем проблема.Использование ui.router вместо ngRoute

В моей консоли я получаю это:

angular.js:38Uncaught Error: [$injector:modulerr] http://errors.angularjs.org/1.4.5/$injector/modulerr?p0=capValueRecruitApp&…ogleapis.com%2Fajax%2Flibs%2Fangularjs%2F1.4.5%2Fangular.min.js%3A19%3A381)

app.js

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

capValueRecruitApp.config(function($stateProvider, $urlRouterProvider) { 
    $stateProvider 
    .state('home', { 
     url: '/home', 
     templateUrl: 'views/home.html' 
    }) 
    .state('about', { 
     url: '/about', 
     templateUrl: 'views/about.html' 
    }); 
    $urlRouterProvider.otherwise('/home'); 
});

index.html

<body ng-app="capValueRecruitApp" class="theme-style-1"> 
<!--WRAPPER START--> 
<div id="wrapper"> 
    <!--HEADER START--> 
    <header id="header" class="header-2 header-3"> 
    <div class="container"> 
     <!--NAVIGATION START--> 
     <div class="navigation-col"> 
     <nav class="navbar navbar-inverse"> 
      <div class="navbar-header"> 
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> 
      </div> 
      <div id="navbar" class="collapse navbar-collapse"> 
      <ul class="nav navbar-nav" id="nav"> 
       <li><a href="#/home" data-path="/home">Home</a></li> 
       .... Some code 
       <li><a href="#/about" data-path="/about">Contact</a></li> 
    ...Some code 
    <div id="main"><div ui-view></div></div> 
    ...Some code 
<!--JQUERY MIN JS--> 
<script src="../scripts/js/jquery-1.11.3.min.js"></script> 
<!--BOOTSTRAP JS--> 
<script src="../scripts/js/bootstrap.min.js"></script> 
<!-- AngularJS --> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.15/angular-ui-router.js"></script> 
</body>

И в моих взглядах папки у меня есть about.html и home.html.

Когда я гугл об этом, я нашел это на аналогичных проблемах в StackOverflow:

Вы пытаетесь использовать $ stateProvider и $ urlRouterProvider которые приходя от «ui.router», и вы не сделали ввести зависимость «ui.router».

источник

2016-03-10 Ichigo Kurosaki

Куда вы загрузили app.js? В <head></head>?

Убедитесь, что ваш заказ загрузка:

Angular.js
UI-Router.js
AppScripts.js

Если вы загружаете app.js перед зависимостями вы 'Получают ошибки, поскольку модули недоступны.

например.

<!-- AngularJS --> 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.15/angular-ui-router.js"></script> 
<!-- THIS IS IMPORTANT! --> 
<script src="app.js"></script>

источник

2016-03-10 13:04:57 kreck

Использование ui.router вместо ngRoute

app.js

index.html

ответ

Смежные вопросы