title: angularjs i18n routing with path params
body: <p>In one application that I'm working with, the route system need to be integrated with i18n, like the example below:</p>
  
  <pre><code>$routeProvider.when('/:i18n/section', ...);
  </code></pre>
  
  <p>But I'm facing some issues due to, what I guess it is, the <code>$digest</code> cycle, which doesn't change the <code>i18n</code> param at the runtime.</p>
  
  <p>Other issue that I'm facing is, if the location path is pointed to something like:</p>
  
  <pre><code>http://localhost:9000/section/...
  </code></pre>
  
  <p>not like:</p>
  
  <pre><code>http://localhost:9000/en/section/...
  </code></pre>
  
  <p>the <code>i18n</code> path param ends being associated with <code>/section/</code>, which means, on <code>$routeParams</code> service, <code>$routeParams.i18n = 'section';</code>. This is expected, but I need to be able to parse the <code>/:i18n/</code> param, to avoid this conflicts, and change the URL, concatenating one locale, to contextualize the session, replacing the current route with the new one, i18n-ized, whithout refreshing the view/app automatically, yet selectivelly, because some features only need to be changed, not all.</p>
  
  <p>Also, I've designed one service that evaluates, based on a list of possible language settings and its weights, the language that'll be selected to the current context:</p>
  
  <pre><code>var criteria = {
      default: {
          tag: 'en',
          weight: 10
      },
      user: {
          tag: 'pt',
          weight: 20
      },
      cookie: {
          tag: 'zh',
          weight: 30
      },
      url: {
          tag: 'ru',
          weight: 40
      },
      runtime: {
          tag: 'es',
          weight: 50
      }
  };
  
  function chooseLanguage (languages) {
      var deferred = $q.defer();
      var weights = [];
      var competitors = {};
      var choosen = null;
  
      if (defineType(languages) === 'array') {
          for (var i = languages.length - 1; i &gt;= 0; i--) {
              if (languages[i].tag !== null) {
                  weights.push(languages[i].weight);
  
                  competitors[languages[i].weight] = languages[i];
              }
          }
  
          choosen = competitors[Math.max.apply(Math, weights)];
      } else if (defineType(languages) === 'object') {
          choosen = languages;
      } else {
          return;
      }
  
      setRuntimeLanguage(choosen.tag);
  
      deferred.resolve(choosen);
  
      return deferred.promise;
  }
  </code></pre>
  
  <p>Explaining the code above, when angular bootstraps the app, the snippet is executed, selecting which language is defined and if its strong enough to be selected. Other methods are related to this operation, like de detection of the URL param, if there's one logged user, etc, and the process is executed not only on the bootstrap, but on several contexts: <code>$routeChangeStart</code> event, when the user autenticates its session, switching the languages on a select box, and so on.</p>
  
  <p>So, in resume, i need to be able to:</p>
  
  <ol>
  <li>Parse the URL and apply the locale param properly, if its not informed initialy;</li>
  <li>Change the URL <code>i18n</code> param during the runtime, whithout reloading the whole view/app;</li>
  <li>Deal with the language changes correctly, which means, if my approach based on weights isn't the better way to go, if you suggest me something else.</li>
  </ol>
  
  <h1>Edit 1:</h1>
  
  <p>A <code>$watcher</code> doesn't do the trick because the app needs the correct locale in every path, even before it instantiates all the elements. <code>AngularJS</code> is used in every step of this check, but if there's any clue to do this outside, before Angular instantiates, we can discuss about it.</p>
  
  <p>For now, I'm using the accepted answer below, with a solution that I developed, but it has to be improved.</p>