angularjs - Angular UI router default parameters wind up with URL http://example.com/#/deliverables////. A way to avoid consecutive slashes? -
here couple states app:
angular.module("app").config([ '$stateprovider', '$urlrouterprovider', '$httpprovider', function ($stateprovider, $urlrouterprovider, $httpprovider) { 'use strict'; $httpprovider.defaults.withcredentials = true; //#region routing $urlrouterprovider.otherwise("/login"); $stateprovider.state('client1', { onenter: function () { }, views: { "index": { templateurl: 'indexview.html' } } }).state('client1.deliverables', { url: '/deliverables/:taxyear/:entity/:deliverable/:status', onenter: function () { }, views: { "nav": { templateurl: 'nav/nav.html', controller: 'navcontroller' }, "content": { templateurl: 'deliverables/deliverables.html', controller: 'deliverablescontroller' }, "footer": { templateurl: 'footer.html', }, reloadonsearch: false }
on occasion, want load deliverables state default parameters. i'd prefer not use dummy strings... there better way this?
$state.go('^.deliverables', { taxyear: null, entity: null, status: null }); // navigate dashboard
but wind 3 slashes on url. http://example.com/#/deliverables////. there way make more friendly url without using dummy parameters? there better way without winding 3 slashes in row? it's not end of world, looks foreign.
if create 2 different states, have replicate of state information twice.
edit: want load page nullable parameters. when so, 3 consecutive slashes. other times, want change state , provide actual values. works fine. there way handle without duplicating state information 2 states?
edit2: page has 4 inputs filter jquery datatable. on first page load of deliverables page, not filter of inputs. able angular equivalent of deep linking page. these deep links filter table. why have parameters on url
ui-router 0.2.12 supports squashing of default param values.
see issue rfc: https://github.com/angular-ui/ui-router/issues/1501
see plunk: http://plnkr.co/edit/vmpc8d7oug0b1r3quice?p=preview demo.
you can specify how each param's default value squashed.
given following states:
$stateprovider.state({ name: "user", url: "user/:username", parent: 'top', params: { username: { value: function(session) { return session.username; } } }, resolve: { user: function($stateparams, users) { return users[$stateparams.username]; }, galleries: function($stateparams, photos) { return photos[$stateparams.username] } }, templateurl: 'user.html', controller: function($scope, $state, user, galleries) { $scope.user = user; $scope.galleries = galleries; } }); $stateprovider.state({ name: "user.gallery", url: "/gallery/:galleryid", resolve: { photos: function($stateparams, galleries) { return galleries[$stateparams.galleryid]; } }, params: { galleryid: { value: "favorites" } }, templateurl: 'gallery.html', controller: function($scope, $state, $stateparams, photos) { $scope.gallery = $stateparams.galleryid; $scope.photos = photos; } }); $stateprovider.state({ name: "user.gallery.photo", url: "/photo/:photoid", resolve: { photo: function($stateparams, photos) { return photos.filter(function(photo) { return photo.id === $stateparams.photoid; })[0]; } }, templateurl: 'photo.html', controller: function($scope, $state, $stateparams, photo) { $scope.gallery = $stateparams.galleryid; $scope.photo = photo; } });
these params:
{ "username": "christopherthielen", "galleryid": "favorites", "photoid": "cn0zrjw" }
will squashed in url so:
{ false: "/user/christopherthielen/gallery/favorites/photo/cn0zrjw", "-": "/user/-/gallery/-/photo/cn0zrjw", "~": "/user/~/gallery/~/photo/cn0zrjw", "": "/user//gallery//photo/cn0zrjw", true: "/user/gallery/photo/cn0zrjw" }
Comments
Post a Comment