2015-10-16 3 views
1

UIRouter ошибка модуля инжектора

var myApp = angular.module('myApp',['ui.router']) 
 
myApp.config(function($stateProvider, $urlRouterProvider){ 
 
    // $urlRouterProvider.otherwise('/home'); 
 
    $stateprovider 
 
    //Home states and nested views 
 
    
 
      .state('home',{ 
 
       url: '/home', 
 
       templateUrl: 'index.html' 
 
      }) 
 
      
 
      
 
    
 
});
<!DOCTYPE html> 
 
<html lang="en"> 
 

 
<head> 
 

 
    <meta charset="utf-8"> 
 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
 
    <meta name="description" content=""> 
 
    <meta name="author" content=""> 
 

 
    <title>Modern Business - Start Bootstrap Template</title> 
 

 
    <!-- Bootstrap Core CSS --> 
 
    <link href="css/bootstrap.min.css" rel="stylesheet"> 
 

 
    <!-- Custom CSS --> 
 
    <link href="css/modern-business.css" rel="stylesheet"> 
 

 
    <!-- Custom Fonts --> 
 
    <link href="font-awesome/css/font-awesome.min.css" rel="stylesheet" type="text/css"> 
 

 
    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries --> 
 
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// --> 
 
    <!--[if lt IE 9]> 
 
     <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script> 
 
     <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script> 
 
    <![endif]--> 
 
    
 
</head> 
 

 
<body ng-app="myApp"> 
 
    <div ng-include='"templates/header.html"'></div> 
 
    <div ui-view></div> 
 
    <div ng-include='"templates/footer.html"'></div> 
 
    
 
    
 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.7/angular.min.js"></script> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.15/angular-ui-router.min.js"></script> 
 
    <script src="js/app.js"></script> 
 
    <!-- jQuery --> 
 
    <script src="js/jquery.js"></script> 
 

 
    <!-- Bootstrap Core JavaScript --> 
 
    <script src="js/bootstrap.min.js"></script> 
 

 
    <!-- Contact Form JavaScript --> 
 
    <!-- Do not edit these files! In order to set the email address and subject line for the contact form go to the bin/contact_me.php file. --> 
 
    <script src="js/jqBootstrapValidation.js"></script> 
 
    <script src="js/contact_me.js"></script> 
 
</body> 
 

 
</html>

Вот мой HTML и app.js Я работаю с UIRouter. Я получаю ошибку модуля инжектора, но не могу понять это. Я новичок в AngularJS, поэтому, пожалуйста, помогите мне. И да, мой ng-include тоже не работает. При запуске моего файла index.html результаты не отображаются.

ответ

2

Существует a working plunker

Корпус имеет важное значение. Это $stateProvider не $ stateprovider. Это должно быть состояние Защиту:

var myApp = angular.module('myApp', ['ui.router']) 
myApp.config(function($stateProvider, $urlRouterProvider) { 
    $urlRouterProvider.otherwise('/home'); 
    //$stateprovider 
    $stateProvider 
    //Home states and nested views 
    .state('home', { 
    url: '/home', 
    //templateUrl: 'index.html' 
    template: "<h1>hello from home</h1>", 
    }) 
}); 

Проверить это here

Примечание: при разработке ... НЕ использовать мин версии. Только полный может дать вам приятно и легко понять исключения ...

+0

он работал. thankx a ton –

+0

Это здорово видеть, наслаждаться удивительным UI-Router;) –

1

$stateprovider должен быть $stateProvider

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