AngularJS / UI Router - Locale in State URL / TemplateURL

Question

What I'm trying to accomplish is to set a $scope variable to the state parameters,

  .state('form', {
        url: '/' + locale + '/form',
        templateUrl: locale + '/form.html',
        controller: 'formController'
    })

Currently I'm just using a variable

var locale

However I want the URL's to dynamically change if the

$scope.locale

changes. For example, if the user selects English, then the scope will change to

$scope.locale = 'en';

I want this to also reflect in the states / URL, and bring the user to the appropriate language page. I guess I'm trying to do something like this:

  .state('form', {
        url: '/' + $scope.locale + '/form',
        templateUrl: $scope.locale + '/form.html',
        controller: 'formController'
    })

Is there any way to live-update this $scope information in the $stateParams??

How can I accomplish a live change in both templateUrl as well as URL of the page?

weisk · Accepted Answer · 2016-06-27 15:28:56Z

1

You should do that by specifying parameters in the url, and templateUrl a function with injected $stateParams:

  .state('form', {
        url: '/:locale/form',
        templateUrl: function($stateParams) { return $stateParams.locale + '/form.html' },
        controller: 'formController'
    })

answered Jun 27, 2016 at 15:28

weisk

2,5402 gold badges20 silver badges18 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

AngularJS / UI Router - Locale in State URL / TemplateURL

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related