Как сделать, чтобы templateURL прокручивал определенную часть страницы? - PullRequest
0 голосов
/ 30 апреля 2020

Можете ли вы, ребята, помочь мне с моим routeProvider?

$routeProvider.when('/farm', {
        templateUrl: '/index.htm#farm'
    });

#farm не работает. Я хотел, чтобы, когда кто-то нажимал на ссылку Ферма из outlook, он go переходил на страницу индекса и прокручивал там, где есть идентификатор farm. У моего div уже есть идентификатор фермы, поэтому я полагаю, с этим нет проблем.

Я прочитал много источников и решений, но все они говорят, что якорные теги не работают в templateURL. Мне было интересно, если вы, ребята, нашли способ обойти это.

Кстати, пример ссылки: www.test.com/index#farm Нажатие на эту ссылку в электронном письме Outlook не приведет к прокрутке вниз до значения #farm. Вместо этого он переходит на страницу индекса и превращает URL-адрес только в /index без #farm

Вот еще одна часть моего кода на случай, если эти ребята возятся с ним:

$locationProvider.hashPrefix('');

    $routeProvider.when('/index', {
        templateUrl: '/index.htm'
    });
    $routeProvider.when('/farm', {
        templateUrl: '/index.htm#farm'
    });
    $routeProvider.when('/error', {
        templateUrl: '/error.htm'
    });
    $routeProvider.otherwise({ redirectTo: '/index' });

Я думаю, что .otherwise делает его go для index.htm. Есть ли другой способ просто добавить еще один routeProvider и templateURL, который может прокрутить вниз до места, где ферма находится на странице индекса?

Когда я попробовал templateURL: '/index.html#farm', он только перешел к /index%23farm, который не прокручивается вниз .

Таким образом, в основном это внешняя ссылка (из электронной почты), и если они щелкают по ней, я хочу, чтобы они прокрутили вниз до значения #farm.

1 Ответ

1 голос
/ 04 мая 2020

Используйте $ anchorScroll ();

Вставьте $ anchorScroll в свой контроллер и используйте его как таковой.

https://docs.angularjs.org/api/ng/service/ $ anchorScroll

 // the element you wish to scroll to.
  $location.hash('farm’);

  // call $anchorScroll()
  $anchorScroll();
...