Регулятор добавления AngularJS

Я создаю сайт с одной страницей, используя MEAN, я пробовал несколько обучающих программ и искал множество примеров, но я не могу заставить его работать. Я использую angular-routing для своих шаблонов, но когда я добавляю контроллер - шаблоны не отображаются. Никакой ошибки.Регулятор добавления AngularJS

app.js

angular.module('sampleApp', ['frontPageCtrl','ngRoute', 'appRoutes']);

appRoutes.js

angular.module('appRoutes', []) 
.config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) { 

    $routeProvider 

     .when('/', { 
      templateUrl: 'views/home.html', 
      controller: 'frontController' 
     }) 
     .otherwise({ 
      redirectTo: '/' 
     }); 


    $locationProvider.html5Mode(true); 
    }]);

frontPageController.js

angular.module('frontPageCtrl', []) 
.controller('frontController', function($scope, $http) { 
});

В моем index.html файл я включил все три файла с app.js первым и после углового включают.

EDIT:

Это мой index.html

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="UTF-8"> 
<base href="/"> 

    <link rel="stylesheet" href="libs/bootstrap/dist/css/bootstrap.min.css"> 
<link rel="stylesheet" href="libs/font-awesome/css/font-awesome.min.css"> 
<link rel="stylesheet" href="css/frontPage.css"> 
<link rel="stylesheet" href="libs/bootstrap/" 

<!-- JS --> 
<script src="libs/angular/angular.min.js"></script> 
<script src="libs/angular-route/angular-route.min.js"></script> 

<script src="js/app.js"></script> 
<script src="js/appRoutes.js"></script> 
<script src="js/controllers/frontPageController.js"></script> 
</head> 
<body ng-app="sampleApp" ng-controller="frontController"> 
<div id="container"> 

<div id="content"> 
    <div ng-view></div> 

</div> 
</div> 
</body> 
</html>

источник

2016-02-23 user2798413

добавить plnkr, так что другие могут помочь более easliy –

plnkr? @NitsanBaleli – user2798413

является frontController как переменная - доступен в том файле, где у вас есть $ routeProvider? затем используйте frontController - без кавычек (!) – shershen

Вещи, чтобы проверить

Вы добавили нг-вид в Уре основной целевой странице
У вас addd ng-app = "sampleApp" на главной целевой странице.
Поместите точку останова в контроллере просто чтобы убедиться, что он получает там
Проверьте вкладку сети и убедитесь, что все файлы JavaScript загружаются

И не забудьте пометить его как ответ, если это отвечает ur question :)

источник

2016-02-23 10:44:26

Насколько я могу видеть после просмотра вашего кода, ваша инъекция зависимостей неверна. См. Изменения в appRoutes.js, app.js, index.html и вам необходимо home.html с frontController внутри вашей папки views.

Ваш app.js должно быть:

angular.module('appRoutes', []);

Ваш appRoutes.js должно быть:

angular.module('sampleApp', ['frontPageCtrl','ngRoute', 'sampleApp']) 
    .config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) { 

     $routeProvider 

      .when('/', { 
       templateUrl: 'views/home.html', 
       controller: 'frontController' 
      }) 
      .otherwise({ 
       redirectTo: '/' 
      }); 


     }]);

и ваш frontPageController.js:

angular.module('frontPageCtrl', []) 
    .controller('frontController', function($scope, $http) { 
    });

И, в индексе .html:

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
     <meta charset="UTF-8"> 
     <base href="/"> 
     <link rel="stylesheet" href="libs/bootstrap/dist/css/bootstrap.min.css"> 
     <link rel="stylesheet" href="libs/font-awesome/css/font-awesome.min.css"> 
     <link rel="stylesheet" href="css/frontPage.css"> 
     <link rel="stylesheet" href="libs/bootstrap/" 
     <!-- JS --> 
     <script src="libs/angular/angular.min.js"></script> 
     <script src="libs/angular-route/angular-route.min.js"></script> 
     <script src="js/appRoutes.js"></script> 
     <script src="js/app.js"></script> 
     <script src="js/controllers/frontPageController.js"></script> 
    </head> 
    <body ng-app="sampleApp"> 
     <div id="container"> 
     <div id="content"> 
      <div ng-view></div> 
     </div> 
     </div> 
    </body> 
</html>

И ваш home.html должен иметь контроллер frontController. По умолчанию home.html примет frontController, если ng-controller="frontController" не используется.

<div ng-controller="frontController">

Здесь работает plunker: http://plnkr.co/edit/ohe4U0Am83U5Hj05HOIv?p=preview

источник

2016-02-23 10:53:24

Пробовал это и еще ничего – user2798413

let я редактировал его, вам не хватало указателя, вот почему я предположил и разместил его. –

все еще не работает, я даже попытался поместить весь мой угловой код в тот же файл, что и Шершан, прокомментировал оригинал сообщения. – user2798413

ответ

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