Перенаправление из Angular JS не работает для URL-адреса с хэшем «#»

Предыстория того, как я инициализирую свое приложение AngularJS, находится здесь: SCRIPT5022: достигнуто 10 итераций $digest(). Прерывание! и перенаправление на index.html

Летняя проблема

Когда я делаю window.location = $scope.myReturnUrl и если возвращаемый URL-адрес содержит "#", вместо перезагрузки страницы AngularJS фиксирует изменение URL-адреса и переходит к .otherwise части настройки поставщика маршрутизации, и приложение Angular снова загружается. Но я ожидаю, что он будет перенаправлен на указанный URL-адрес.

Кратко о том, как я это делаю:

Я загружаю свое приложение AngularJS внутри Bootstrap Modal, вот как я инициализирую

var markup = '<div id="ng-app" ng-app="myapp" xmlns:ng="http://angularjs.org"><div ng-controller="MyAppAppCtrl"><div ng-view></div></div></div>';
jQuery('#works-modal').html(markup);
angular.bootstrap(jQuery('#ng-app'), ['myapp']);   
jQuery('#works-modal').modal('show');

в моем app.js для html5mode установлено значение false для всех модулей:

$locationProvider.html5Mode(false)

Итак, когда мое приложение инициализировано, URL-адрес выглядит примерно так:

http://my-site.uk/user/dashboard.html#/mywork/find/id/9780273651

Теперь в модальном диалоговом окне есть кнопка отмены, щелчок по которой я перехватываю с помощью ng-click, и при нажатии он просто выполняет перенаправление, например

window.location = $rootScope.returnToUrl;

теперь, в моем случае, возвращаемый URL-адрес содержит идентификатор ссылки, по которой щелкнули, чтобы браузер мог прокручивать до определенного раздела, возвращаемый URL-адрес:

http://my-site.uk/user/dashboard.html#my-work1

моя конфигурация провайдера маршрутизации

$routeProvider.
        when('/mywork/find/:id', {
          templateUrl: '/mywork/partials/find/find.html',
          controller: WorkCtrl
        }).
        when('/mywork/find/review/submit/:id', {
          templateUrl: '/mywork/partials/review.html',
          controller: ReviewCtrl
        }).
      otherwise({
        redirectTo: '/mywork/find/id/'+id
      });

Проблема

Теперь, когда я пытаюсь перенаправить на: http://my-site.uk/user/dashboard.html#my-work1 вместо перезагрузки страницы и прокрутки до назначенного #ID, AngularJS фиксирует изменение URL-адреса и вместо этого перезагружает приложение. это происходит потому, что AngularJS фиксирует изменение URL-адреса и переходит к .otherwise части настройки поставщика маршрутизации, а приложение Angular загружается снова. Но я ожидаю, что он будет перенаправлен на указанный URL-адрес.

Я использую html5mode (true) по исторической причине (упомянутой в этой теме: SCRIPT5022: достигнуто 10 итераций $digest(). Прерывание! и перенаправление на index.html)

Я не хочу удалять # из моего обратного URL, потому что это нарушит рабочий процесс. Любое предложение, как преодолеть это?

Спасибо,

Равиш


angularjs angularjs-routing
person Ravish    schedule 08.11.2013    source источник

Ответы (2)


arrow_upward
0
arrow_downward

Похоже, вы хотите http://my-site.uk/user/dashboard.html#my-work1, чтобы перенаправить вас на панель инструментов.html и прокрутить до элемента с id="my-work1".

Вы можете взглянуть на $anchorScroll(http://docs.angularjs.org/api/ng.$anchorScroll). Я не уверен, как это работает, поскольку мне никогда не приходилось его использовать, но я знаю, что оно решает такие проблемы, как ваша.

person NicolasMoise    schedule 08.11.2013
comment
однако есть одна проблема, что, если я пытаюсь перейти на страницу, которая не является приложением AngularJS? Я имею в виду, что я хочу перейти к этому конкретному разделу, но вся эта страница не AngularJS. Я использую window.location = MY_REDIRECT_URL для перенаправления на какую-то страницу. URL-адрес перенаправления содержит #, но должен быть способ «сказать» AngularJS, что он не слушает /^these_urls[-]*/i, ? - person Ravish; 10.11.2013
comment
Я решил свою проблему, используя обходной путь, я подробно отвечу на свой вопрос. спасибо за Ваш ответ - person Ravish; 09.12.2013

arrow_upward
0
arrow_downward

в вашем URL-адресе (http://my-site.uk/user/dashboard.html#my-work1) попробуйте передать «my-work1» в качестве параметра в routeProvider, например http://my-site.uk/user/dashboard.html/my-work1.

пример:

when('/my/route/:param', {
    templateUrl: '/mywork/partials/param.html',
    controller: WorkCtrl
})

в вашем контроллере получите этот параметр с помощью $routeParams.

var myParam = $routeParams.param
$location.hash(myParam)//set anchor
$anchorScroll()//do scroll

Я надеюсь, что это решит вашу проблему

person ops.rio    schedule 08.11.2013
comment
@ops-rio есть одна проблема, но что, если я пытаюсь перейти на страницу, которая не является приложением AngularJS? Я имею в виду, что я хочу перейти к этому конкретному разделу, но вся эта страница не AngularJS. Я использую window.location = MY_REDIRECT_URL для перенаправления на какую-то страницу. URL-адрес перенаправления содержит #, но должен быть способ «сказать» AngularJS, что он не слушает /^these_urls[-]*/i, ? - person Ravish; 10.11.2013
comment
@RavishTiwari, не могли бы вы создать jsfiddle? - person ops.rio; 13.11.2013
comment
позвольте мне посмотреть, смогу ли я создать один - person Ravish; 14.11.2013
comment
@ops-rio Я решил свою проблему, используя обходной путь, я подробно отвечу на свой вопрос. спасибо за Ваш ответ - person Ravish; 09.12.2013