I have .when('/center', '/center/question')
in my angular web app.
When I type '/center'
in my browser it will redirect to '/center/question'
as I expect but when I click the <a ui-sref="center" href="#/center"></a>
, it won't redirect and just stay on the url '/center'
.
There is no error in my console and I don't know why.
I see one similar issue here Angular UI-Router $urlRouterProvider .when not working anymore .I try the answer but it still don't work for me.
Here is my coffeescript code:
whenConfig = ['$urlRouterProvider', ($urlRouterProvider) ->
# default url config
$urlRouterProvider
.otherwise '/center'
.when '/center', '/center/question'
]
stateConfig = ['$stateProvider', ($stateProvider) ->
# nested url config
capitalize = (s)->
s[0].toUpperCase() + s[1..]
mainConfig = ({
name: name
url: "/#{name}"
templateUrl: "templates/#{name}.html"
controller: "#{capitalize name}Ctrl"
} for name in ['center', 'keywordList', 'keywordConfig', 'log', 'stat'])
centerConfig = ({
name: "center.#{name}"
url: "/#{name}?page"
templateUrl: "templates/center/#{name}.html"
controller: "Center#{capitalize name}Ctrl"
resolve:
thead: (CenterService) ->
CenterService.getThead @self.name
data: (CenterService, $stateParams) ->
CenterService.fetchItems @self.name, $stateParams.page
} for name in ['question', 'answer', 'comment', 'article'])
for singleConfig in mainConfig
$stateProvider.state singleConfig
for childConfig in centerConfig
$stateProvider.state childConfig
]
app.config whenConfig
app.config stateConfig
There is a new working plunker (extending the Angular UI-Router $urlRouterProvider .when not working *anymore* ) , which should be working with the version 0.2.13+
Until version 0.2.12-
we could use $urlRouterProvider.when()
, suggested in documenation (small cite) :
How to: Set up a default/index child state
...
if you want the 'parent.index' url to be non-empty, then set up a redirect in your module.config using $urlRouterProvider:
$urlRouterProvider.when('/home', '/home/index');
So this was solution shown in the Q & A mentioned above:
var whenConfig = ['$urlRouterProvider', function($urlRouterProvider) {
$urlRouterProvider
.when('/app/list', ['$state', 'myService', function ($state, myService) {
$state.go('app.list.detail', {id: myService.Params.id});
}])
.otherwise('/app');
}];
...
app.config(whenConfig)
Now - we cannot.
0.2.13
It is due to "FIX" (which I am simply not sure about) , mentioned in the release 0.2.13
Bug Fixes
$state:
- ...
- Avoid re-synchronizing from url after .transitionTo ( b267ecd3 , closes #1573 )
And here is the new code added in the urlRouter.js :
if (lastPushedUrl && $location.url() === lastPushedUrl)
// this line stops the corrent .when to work
return lastPushedUrl = undefined;
lastPushedUrl = undefined;
This piece of code is optimizing/fixing some other issue ... but also, turning off the .when()
functionality
As already mentioned, this brand new plunker shows the way with version 0.2.13+. We just have to listen to state change, and if the state is "app.list" we can go to its detail with some id...
var onChangeConfig = ['$rootScope', '$state',
function ($rootScope, $state) {
$rootScope.$on('$stateChangeStart', function (event, toState) {
if (toState.name === "app.list") {
event.preventDefault();
$state.go('app.list.detail', {id: 2});
}
});
}]
Check the plunker here
You can do this in your controller too. I think it is cleaner than listening to state changes.
Example:
.controller 'YourControllerName', ($scope, $state) ->
$state.go "center.question" if $state.is "center"
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.