angularjs 1.6.1页面刷新后，上一个页面传递过来的参数变成undefined

angularjs 1.6.1页面刷新后，上一个页面传递过来的参数变成undefined。

情景描述：有一个文章标题列表页面，点击标题，进入文章详细内容页面，这个过程需要把文章id传递过去，但是angularJs中传递参数，进入文章详细内容后，刷新页面，文章id变成了undefined，页面出错。

为了解决这个问题，我只找到了下面的这种传参方式：

1.路由文件

.state('list', {
                url: '/list',
                views: {
                    'main': {
                        templateUrl: 'modules/list/list.html',
                        controller: 'listCtrl'
                    }
                }
            })
            .state('person', {
                url: '/person',
                views: {
                    'main': {
                        templateUrl: 'modules/person/person.html',
                        controller: 'personCtrl'
                    }
                }
            })
            .state('detail', {
                url: '/list/detail?:id',
                views: {
                    'main': {
                        templateUrl: 'modules/detail/detail.html',
                        controller: 'detailCtrl'
                    }
                }
            });
    }]);

2.list.html

<div ng-repeat="lt in list">
    <a style="display:block;margin: 10px;" ui-sref="detail({id:lt.subId})">{{lt.subTitle}}</a>
</div>

3.detailController.js

.controller('detailCtrl', ['$scope', '$stateParams', 'dataService', function ($scope, $stateParams, dataService) {
            $scope.id = $stateParams.id;
        }]);

只有通过上面的这种方式传递参数，然后在详细页面中用$stateParams.id;接收，这样获取的参数才不会因为页面的刷新而消失。