Question

我有一个简单的应用程序，以表格格式显示数据。在此表中，您可以单击列以升序/降序对其进行排序，进行搜索等。我希望在发生类似这样的事件时更改URL，这样如果有人获得了URL，他们将被呈现给信息的方式相同。

目前，当点击一列来排序asc / desc时，会调用它：

<a ui-sref="name({column:'\''+column+'\'',sort:reverse})">

“name”是这里定义的状态：

app.config(['$stateProvider', '$urlRouterProvider',
    function ($stateProvider, $urlRouterProvider) {
        $stateProvider.state('name', {
            url: '/column/:column/desc/:sort/',
            controller: 'Ctrl'
        });
        $urlRouterProvider.otherwise('/');
    }
]);

当位置发生变化时，这称为：

    $scope.$on('$stateChangeSuccess', function (evt, toState, toParams, fromState, fromParams) {
        $scope.predicate = toParams.column;
        $scope.reverse = boolVal(toParams.sort);
    });

在页面加载之后，所有内容都正常，但是，当我尝试使用最初从URL加载参数的页面时，它不起作用。

$scope.$on('$viewContentLoaded', function (event, viewConfig) { console.log(($location.search()).column); });

我尝试使用上面的方法来获取url中的column参数，但是当我在console.log中时，它返回undefined。即使在页面加载后，并且更改了URL并且一切正常，viewContentLoaded 仍然记录未定义。我做错了吗？

示例网址可能如下所示： www.domain.com/column/'column name'/ desc / false /

然后，表格将按照“列名称”按升序排序。它的工作原理除了初始页面加载外。

编辑：

尝试了以下操作，在页面加载时使用参数记录了一个空对象。单击列后，stateParams以正确的值记录。

app.controller('Ctrl', ['$stateParams', function ($stateParams) { $scope.$on('$viewContentLoaded', function (event, viewConfig) { console.log('stateParams: '+angular.toJson($stateParams)); }); }]);

Answer 1

您想要的不是$location.search()，而是$stateParams

试试这个：
使用DI将$stateParams注入控制器并使用：

$scope.$on('$viewContentLoaded', function (event, viewConfig) {
    console.log($stateParams.column);
});

还设置您的默认路线以匹配与州相关联的网址。

$urlRouterProvider.otherwise("/column/'Architect'/desc/true/");

其他信息：
$location.search()会将信息从query string（在网址中的?之后）中提取出来，而不是网址路径。
如果您有www.domain.com?column='column name'&desc=false，则$location.search().column会返回您的值。

$stateParams会将您在状态网址中使用的:name映射到实际网址中对应的值

奇怪的$ stateParams行为

1 个答案: