AngularJS — как правильно перенаправить на detail?

#javascript #angularjs #redirect

#javascript #angularjs #перенаправление

Вопрос:

Я хотел бы спросить, как правильно перенаправить на страницу detail (или любую страницу приложения)?

Приложение считывает подробные данные пользователя из REST api,

итак, если бы я попробовал действие в этом порядке:

  • Нажмите на кнопку detail
  • Маршрут к заданной странице и в data-ng-init запускается методом контроллера
  • Получить идентификатор из GET param
  • Сделайте запрос к REST API
  • Отобразить ответ в деталях

Я несколько раз получаю подробную страницу без данных (я должен дождаться ответа API).

Я думаю, что лучшим решением является это:

  • Нажмите на кнопку detail
  • Запускает метод detail на контроллере и получает данные из REST API
  • Если данные действительны, создайте область с данными
  • Перенаправить на detail со всеми заполненными полями

Второе решение у меня не работает.

Я пытался сделать таким образом:

 // fill scope by user data
$scope.UserDetail = data.result;
// redirect to user detail
var url = "users/detail/" userId;
$location.path(url);
scope.$apply();
  

Но данные не передаются в представление (не отображаются).

Вопрос в том:

Как правильно сделать перенаправление с загрузкой данных и каковы методы ставок для этого?

Большое спасибо за любой совет.

Ответ №1:

Я думаю, что вам нужен resolve механизм $routeProvider . После этого вы можете дождаться разрешения некоторых обещаний (вашего вызова API rest) перед отображением вашей страницы..

Пример :

 yourModule.config(['$routeProvider',
    function($routeProvider) {

        $routeProvider.when("/users/detail/:userId", {
            templateUrl: 'userDetails.tpl.html',
            controller: ['$scope', 'myRestData',
                function($scope, myRestData) {
                    // controller stuff
                    // myRestData contains the resolved promise
                }
            ],
            resolve : {
                myRestData : ['myRestService', function(myRestService) {
                    return myRestService.get(); //must return a promise
                }]
            }
        })

])
  

Теперь вам просто нужна стандартная ссылка для перехода по этому URL (или ручное $location.path(url); обновление)

Дополнительная информация:https://docs.angularjs.org/api/ngRoute/provider $routeProvider