У меня есть три файла:
- index.html
- Players.html
- app.js
index.html: довольно просто.
<body>
<main ng-view></main>
</body>
Players.html: , в котором должен отображаться список игроков.
<section>
<ul>
<li ng-repeat="player in players">
<h4>{{player}}</h4>
</li>
</ul>
</section>
app.js: , который содержит маршрут до /players
и контроллер , в котором есть список игроков, отображаемых на виде.
// Module
const myApp = angular.module('myApp', ['ngRoute']);
myApp.config(['$routeProvider', $routeProvider => {
$routeProvider
.when('/players', {
controller: 'playersController',
templateUrl: 'views/players.html'
})
}]);
// Controller
myApp.controller('playersController', ['$scope', $scope => {
$scope.players = ['Kaka', 'Maldini', 'Nesta'];
}]);
Когда я направляю в '/ Players', контроллер не вызывается и ничего не отображается, однако, когда я вместо этого использую ng-include
и добавляю контроллер в качестве атрибута, он работает нормально.