Почему контроллер не вызывается, когда я вручную перезагружаю страницу? И как это исправить?

0

Я работаю с angular.js. У меня есть список элементов, и когда я нажимаю на один из них, он должен отображать определенный шаблон.

Все работает, если я использую приложение из корня (index.html), но после нажатия элемента, если я перезагружаю страницу (с измененным URL-адресом), контроллер не звонит, даже если я пытаюсь нажать на тот же снова.

Вот мой код:

config.js

app.config(['$routeProvider', function($routeProvider) {
    $routeProvider
        .when('/building/:buildingName', {
            templateUrl: 'views/building.html',   
            controller: 'buildingCtrl'
        })
        .otherwise({redirectTo: '/'});
}]);

townCtrl.js

app.controller('townCtrl', ['$scope', '$routeParams',
    function ($scope, $routeParams) {    
        $scope.buildingsList = [{
            name: 'Foo',
            route: 'foo'
        }, {
            name: 'Bar',
            route: 'bar'
        }];

        $scope.select = function (item) {
            $scope.selected = item;
        };
    }
]);

buildingCtrl.js

app.controller('buildingCtrl', ['$scope', '$routeParams', 
    function ($scope, $routeParams) {         
        console.log($routeParams.buildingName); 
    }
]);

town.html

<div class="row" ng-controller="townCtrl">
    <div class="col-md-3">
        <div class="list-group">
            <a ng-repeat="building in buildingsList" 
               ng-click="select(building)" 
               ng-class="{active: selected === building}"
               class="list-group-item"
               ng-href='#/building/{{building.route}}'>
                {{building.name}}
            </a>
        </div>
    </div>
    <div class="col-md-9">
        <div ng-view></div>
    </div>
</div>

Итак, когда я нажимаю на элемент Foo, url стал ~/#/building/foo, buildingCtrl отображает "foo" в консоли, а building.html правильно отображается на странице.

Но если я перезагружу страницу вручную (то есть F5), URL-адрес останется прежним, build.html не будет отображаться, а хуже всего, если я нажму на "Foo", снова ничего не добавит...

Не могли бы вы помочь мне исправить это? Вероятно, я пропустил что-то на маршруте.

Теги:
routes

1 ответ

1

Похоже, вы дважды используете cityCtrl - один раз для town.html и один раз для building.html...

Возможно, вам нужно ввести другой контроллер для создания или просто использовать шаблон без него (если вам не нужен контроллер для шаблона здания).

Btw: есть атрибут ui-sref, чтобы упростить ссылку https://github.com/angular-ui/ui-router/wiki/Quick-Reference#ui-sref

  • 0
    Спасибо за ваш ответ. Действительно, TownCtrl был вызван дважды. Я обновляю свой код и мой вопрос. Контроллер отображает в консоли только данные, но позже я буду использовать $ scope для шаблона. У меня та же проблема с двумя разными контроллерами. Спасибо, что поделились angular-ui-router между прочим, я посмотрю на это;)

Ещё вопросы

Сообщество Overcoder
Наверх
Меню