有人知道如何在 ng-repeat 中制作 anchorScroll 吗？

【问题标题】：Does anybody know how to make an anchorScroll inside ng-repeat?有人知道如何在 ng-repeat 中制作 anchorScroll 吗？
【发布时间】：2014-01-15 13:12:52
【问题描述】：

我需要知道如何在 ng-repeat 菜单中制作anchorScroll to differents ID。

<li data-ng-repeat="page in pages">
   <a href="{{href}}">{{ page.title }}</a>
</li>

<div id="1">One</div>
<div id="2">Two</div>

谢谢！

【问题讨论】：

请澄清 - 那些 div 不在 li 中，因此它们不被视为 ng-repeat 结构的一部分。
是的。 div 不是
的一部分。这是一个示例代码，因为我的代码太长，无法放在这里。

问题是滚动到那些 div 还是别的什么？如果是那些 div，那么问题的前提是不正确的——它们实际上并不是 li ng-repeat 的一部分。

你可以看到这个小提琴jsfiddle.net/grevelles/MY6JL

你的小提琴坏了。

标签： angularjs angularjs-ng-repeat angularjs-ng-include

【解决方案1】：

在 ng-repeat 中，您可以使用 index 为每个元素分配不同的 ID。

<li data-ng-repeat="page in pages">
    <a id="link-{{page.index}}" href="{{href}}">{{ page.title }}</a>
</li>

索引将随着pages 中的每个项目而增加。我在 id 中放置link- 的部分是可选的；你可以用这种方式放置任何前缀或后缀。

【讨论】：

【解决方案2】：

你应该能够做这样的事情。我不知道您的对象是什么样的，但这应该会有所帮助。

HTML

<li data-ng-repeat="page in pages">
   <a href="" ng-click="scrollTo(page.index)">{{ page.title }}</a>
</li>

<div id="1">One</div>
<div id="2">Two</div>

控制器

$scope.pages = [
  { title: "test1", index: 1},
  { title: "test2", index: 2}
];
$scope.scrollTo = function(id) {
  document.getElementById(id).scrollIntoView();
};

【讨论】：