Прохожусь по туториалу ангуляра, выполнил распределение по различный файлам(контроллеры отдельно, шаблоны отдельно и т.д.). При подключении ничего не отображается, совершенно. Вот код с клиента index.php:
<!DOCTYPE html>
<html>
<head>
<title>Angular</title>
<script src="angular-js/angular.js"></script>
<script src="test.js"></script>
<script src="controllers.js"></script>
</head>
<body ng-app='NewAppModule'>
<div ng-view></div>
</body>
</html>
Код с модулем test.js:
angular.module('NewAppModule', []);
angular.module('NewAppModule', []).
component('div', {
templateUrl: 'template.html',
controller: 'ContactView' <----Проблема возникает при подключении контроллера в этом месте.
});
и сам шаблон:
<p>
Поиск: <input type='text' ng-model='search' placeholder='Поиск..'>
</p>
<p>
Сортировка: <select ng-model='sort'>
<option value='name'>По имени</option>
<option value='number'>По номеру</option>
</select>
</p>
<ul>
<li ng-repeat="people in $ctrl.contact | filter: search | orderBy: sort" style="list-style: none">
<p>Имя: <a href="/contacts/{{people.name}}">{{people.name}}</a></p>
<p>Телефон: {{people.number}}</p>
<hr>
</li>
</ul>
И контроллер: controllers.js
var ctrl=angular.module('NewAppModule', []);
ctrl.controller('ContactView',['$http', function($http){
var self=this;
var url='/app.json';
$http({url: url, method:'GET'}).then(function(response) {
self.contact=response.data;
});
}]);
Если контроллер объявить в самом модуле, где я указал, то все хорошо появляется. Но если вызываю его из отдельного файла(в моем случае controllers.js) почему-то не проходит вызов+не отображается даже шаблон. Вроде делал все по туториалу. В чем косяк?