在 ng-repeat 中保留元素的位置答案

【问题标题】：Retain position of element in ng-repeat在 ng-repeat 中保留元素的位置
【发布时间】：2014-10-21 05:06:32
【问题描述】：

我有一个使用 ng-repeat 指令在 HTML 页面中显示的对象数组。单击每个项目都会打开一个新的 html 页面。每当我单击任何项目时，它都会将我带到新页面，当我单击返回时，它会将我重新定位到页面顶部（在第一个项目上）。

保留项目位置的最佳方式是什么，这样当用户单击项目时，进入新页面并返回，然后他/她会被带到触发操作的同一元素。

最好有演示。

谢谢！

【问题讨论】：

您的示例中的“页面”是什么？它是 Angular 中的“视图”吗？它是不同的端点 URL 吗？另外，如果“演示更可取”，我建议您创建一个问题并尽量减少其他人帮助您所需的工作。

标签： javascript angularjs angularjs-ng-repeat ng-repeat

【解决方案1】：

如果你要离开你的页面，我猜你有两种处理方式。第一个可能是在离开页面之前强制您的页面到一个引用 ID 的位置。

即：单击 -> location.href('#myItemId') -> location.href('externalResource')。 http://jsfiddle.net/romulocollopy/gj2rss1v/6/

angular.module('myapp',[])
.controller("myCtrl",['$scope',function($scope){

    $scope.fruits = ['banana','aple','passion fruit', 'watermelon', 'spam','eggs'];

    $scope.link_to_fruit_detail = function(fruit){
        location.href = '#/fruit';
        location.href = 'http://www.'+fruit+'.com';
    }
}]);

另一种方法是将点击的 y 位置存储在 cookie 中： http://jsfiddle.net/romulocollopy/gj2rss1v/7/

angular.module('myapp',['ngCookies'])
.controller("myCtrl",['$scope', '$cookieStore',function($scope, $cookieStore){
    if ( $cookieStore.get('y-click') ){
        var y = $cookieStore.get('y-click')
        window.scrollTo(y,0);
        console.log(y)
    }

    $scope.fruits = ['banana','aple','passion fruit', 'watermelon', 'spam','eggs'];

    $scope.link_to_fruit_detail = function($event, fruit){
        location.href = 'http://www'+fruit+'.com';
        $cookieStore.put('y-click', $event.y);
    }
}]);

展位有利有弊，但我想不出更好的方式。

【讨论】：