AngularJS动态模板未正确加载

Question

我已经设置了一个应用程序，以便根据正在使用的设备，它将尝试加载template.device.html，如果失败，则默认加载template.html。但是我遇到了问题，如果我按照URL中包含的路径点击页面，那么模板将无法加载，但是如果我点击页面时没有提供路由，应用程序使用$ routeProvider.otherwise重定向（？）然后它加载正确的路线。关于这里可能发生的事情的任何想法，只有当我在路线中击中.otherwise时这才有效吗？

config(['$routeProvider', function($routeProvider) {
  // Routes are provided in the routes array and then we test if there is a device specific templete for the route and will load.
  // If there is no device template the code will use the default template
  var routes = ['partial1','partial2'];
  angular.forEach(routes, function(route, key) {
    var defaultUrl = 'partials/' + route + '.html',
        deviceUrl = 'partials/' + route + '.' + getDevice() + '.html',
        initInjector = angular.injector(['ng']),
        $http = initInjector.get('$http');
    $http.get(deviceUrl).
      success(function() {
        setRouteProvider($routeProvider, deviceUrl, route);
      }).
      error(function(){
        setRouteProvider($routeProvider, defaultUrl, route);
      });
  });
  $routeProvider.otherwise({redirectTo: '/' + routes[0]});
}]);

function setRouteProvider($routeProvider, url, route) {
  // The controller name will be the route with the first letter capitalized and Ctrl appended to the end. i.e. RouteCtrl.
  $routeProvider.when('/' + route, {templateUrl: url, controller: route.charAt(0).toUpperCase() + route.substring(1) + 'Ctrl'});
}