Javascript 单击链接后滚动到不同模板上的特定元素（Angularjs）

嘿，伙计们，我是个新手

用户可以在profileSettings页面中编辑配置文件设置

我的个人资料模板中包含以下内容：

<div>{{ user.name }}</div>
<a class="pull-right" ui-sref="profileSettings"><strong>Edit Name</strong></a>
...more code...
<div>{{ user.description }}</div>
<a class="pull-right" ui-sref="profileSettings"><strong>Edit Description</strong></a>

{{user.name}
编辑名称
…更多代码。。。
{{user.description}}
编辑说明

我希望他们能够点击编辑链接，将他们带到设置配置文件模板。但是，我希望在新模板呈现时自动滚动到相关字段

因此，如果他们单击名称的编辑链接，他们将被带到profileSettings模板并自动滚动到编辑名称字段。如果他们单击编辑描述链接，那么他们也会重定向到profileSettings页面，但会自动滚动到编辑描述字段

使用Angualar/ui sref是否有一种简单的方法可以做到这一点

使用可选的 当profileSettings状态变为活动状态时将调用的回调函数，以呈现这两个函数：

• 将使用id=“hashValue”

  url-like:/profileSettings.html\hashValue

• 将滚动到该元素

因此，您的代码可能如下所示：

$stateProvider.state('profileSettings', {
  url: '/settings',
  template: 'settings.html',
  controller: 'ProfileSettingsCtrl',
  onEnter: function(){
      $location.hash('hashValue');
      $anchorScroll();
  }
});

注意：记住将

$location

和

$anchorScroll

添加到依赖项中。

使用可选的 当profileSettings状态变为活动状态时将调用的回调函数，以呈现这两个函数：

• 将使用id=“hashValue”

  url-like:/profileSettings.html\hashValue

• 将滚动到该元素

因此，您的代码可能如下所示：

$stateProvider.state('profileSettings', {
  url: '/settings',
  template: 'settings.html',
  controller: 'ProfileSettingsCtrl',
  onEnter: function(){
      $location.hash('hashValue');
      $anchorScroll();
  }
});

---

注意：请记住将

$location

和

$anchorScroll

添加到您的依赖项中。

阅读$anchorScroll docs我正在播放的锚卷轴，但不断获得：$location未定义代码在哪里……我们猜不出您是如何使用它的阅读$anchorScroll docs我正在播放的锚卷轴，但请继续阅读获取：$location未定义代码在哪里…我们无法猜测您是如何使用它的