Question

我试图通过$ stateProvider将用户可识别的网址附加到网址的末尾。

例如，对于StackOverflow的问题，它就是stackoverflow.com/questions/(question_id)/(question title）。我想通过获取question_id然后相应地添加一个短语来在我的URL中实现这一点。有什么想法吗？

$stateProvider
  .state('question', {
    url: '/question/:qid',
    templateUrl: 'q.htm',
    controller:'bla'
    resolve: {
        title: function($http, $stateParams){
            return $http.get('title/'+$stateParams.qid);
        }
    }
  });

然后以某种方式将标题附加到网址。

Answer 1

我想出的一个解决方案是：（click 'Locations' and the table row on this demo）

在$ stateProvider.state

中添加了id，name参数

url: "location/:lid/:name",

但是当＆＃39;盖上＆＃39;未指定，＆＃39; name＆＃39;不会这样指定，URL会显示＆＃39; location //＆＃39;那么，在这种情况下，制作盖子=＆＃39;全部＆＃39;和名字=＆＃39;＆＃39;所以它会告诉＆＃39;控制器显示所有位置，而不是特定位置。

lid: function($stateParams){
    $stateParams.lid = $stateParams.lid || 'all';
    return $stateParams.lid;
},

然后将lid作为依赖项并注入getName。（我使用$ q作为$ http的替代，以显示承诺在下一个依赖项中工作得很好）注意随机化的超时时间。

getName: ['$q','$timeout','lid', function($q, $timeout, lid){
    var deferred = $q.defer();

    $timeout(function() {
        var names = ['Cool Place', 'Awesome place', 'boring place', 'I want to be here', 'Random Venue'];
        deferred.resolve(names[ parseInt(lid) % 4 ]);
    }, Math.round(Math.random()*200));

return deferred.promise;
}],

然后将getName和lid注入名称：

name : ['lid', '$state','$stateParams','getName', function (lid, $state, $stateParams,getName) {
    if($stateParams.lid.length < 1 || $stateParams.lid == 'all'){ // show all or not set Location ID
        $stateParams.name = '';
        return '';
    }
    if($stateParams.name.length > 0){ // if the name is already specified, it's ok. settle
        return $stateParams.name;
    }

    // hyphens are better than %20 in the url
    getName = getName.replace(/\s/g,'-');

    $state.transitionTo('dashboard.location', {lid:lid, name:getName}, {
        reload:true,
        inherit:false,
        notify:true
        })
}]

如果名称不在参数中，则转换为＆＃39;重新加载＆＃39;属性设置为true。

完成。这是演示（click 'Locations' and the table row on this demo）

将所有内容放在一起：

.state('dashboard.location', {
            templateUrl : "apps/location/template/location_template.htm",
            controller: 'LocationCtrl',
            url: "location/:lid/:name",
            resolve: {
                ctrl: function($ocLazyLoad){
                    return $ocLazyLoad.load({
                        name: "dashboard.location",
                        files: ['apps/location/location_controller.js', 'apps/location/style/location.css']
                    });
                },
                lid: function($stateParams){
                    $stateParams.lid = $stateParams.lid || 'all';

                    return $stateParams.lid;
                },
                getName: ['$q','$timeout','lid', function($q, $timeout, lid){
                    var deferred = $q.defer();
                    $timeout(function() {
                        var names = ['Cool Place', 'Awesome place', 'boring place', 'I want to be here', 'Random Venue'];
                        deferred.resolve(names[ parseInt(lid) % 4 ]);
                    }, Math.round(Math.random()*200));
                    return deferred.promise;
                }],
                name : ['lid', '$state','$stateParams','getName', function (lid, $state, $stateParams,getName) {

                    if($stateParams.lid.length < 1 || $stateParams.lid == 'all'){ // show all or not set Location ID
                        $stateParams.name = '';
                        return '';
                    }
                    if($stateParams.name.length > 0){ // if the name is already specified, it's ok. settle
                        return $stateParams.name;
                    }

                    // hyphens are better than %20 in the url
                    getName = getName.replace(/\s/g,'-');

                    $state.transitionTo('dashboard.location', {lid:lid, name:getName}, {
                        reload:true,
                        inherit:false,
                        notify:true
                    })
                }]
            }
        })

我希望这有助于其他人。

将标签附加到URL的StateProvider

1 个答案: