AngularJS有动态路由吗？

角度支持动态布线吗？ 也许是这样的把戏：

$routeProvider.when('/:ctrl/:action', 
                     getRoute($routeParams.ctrl,$routeParams.action))

function getRoute(ctrl, action){
   return {
      templateUrl: ctrl+"-"+action+".html"
      controller: 'myCtrl'
   }
}

---

请帮帮我，我需要获取基于templateUrl的非常规内存。如果要将其降低到控制器级别，请执行以下操作

在本例中，我将按子域覆盖整个页面和部分页面：

app.js

config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
  $locationProvider.html5Mode(true);
  $routeProvider.when('/', {
    template: 'home'
  });
  $routeProvider.when('/contact', {
    template: 'contact'
  });
  $routeProvider.otherwise({redirectTo: '/'});
}])

controller('AppController', ['$scope','Views', function($scope, Views) {    
  $scope.$on("$routeChangeSuccess",function( $currentRoute, $previousRoute ){
    $scope.page = Views.returnView();
  });

  $scope.returnView = function(partial){
    return Views.returnView(partial);
  }    

}])

factory('Views', function($location,$route,$routeParams,objExistsFilter) {  

  var viewsService = {};
  var views = {
    subdomain1:{
      'home':'/views/subdomain1/home.html'
    },
    subdomain2:{

    },
    'global.header':'/views/global.header.html',
    'global.footer':'/views/global.footer.html',
    'home':'/views/home.html',
    'home.carousel':'/views/home.carousel.html',
    'contact':'/views/contact.html',
  };

  viewsService.returnView = function(partial) {
    var y = (typeof partial === 'undefined')?$route.current.template:partial;
    var x = $location.host().split(".");
    return (x.length>2)?(objExistsFilter(views[x[0]][y]))?views[x[0]][y]:views[y]:views[y];
  };

  viewsService.returnViews = function() {
  return views;
  };

  return viewsService;
}).

filter('objExists', function () {
  return function (property) {
    try {
      return property;
    } catch (err) {
      return null
    }
  };
});

controllers.js

config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
  $locationProvider.html5Mode(true);
  $routeProvider.when('/', {
    template: 'home'
  });
  $routeProvider.when('/contact', {
    template: 'contact'
  });
  $routeProvider.otherwise({redirectTo: '/'});
}])

controller('AppController', ['$scope','Views', function($scope, Views) {    
  $scope.$on("$routeChangeSuccess",function( $currentRoute, $previousRoute ){
    $scope.page = Views.returnView();
  });

  $scope.returnView = function(partial){
    return Views.returnView(partial);
  }    

}])

factory('Views', function($location,$route,$routeParams,objExistsFilter) {  

  var viewsService = {};
  var views = {
    subdomain1:{
      'home':'/views/subdomain1/home.html'
    },
    subdomain2:{

    },
    'global.header':'/views/global.header.html',
    'global.footer':'/views/global.footer.html',
    'home':'/views/home.html',
    'home.carousel':'/views/home.carousel.html',
    'contact':'/views/contact.html',
  };

  viewsService.returnView = function(partial) {
    var y = (typeof partial === 'undefined')?$route.current.template:partial;
    var x = $location.host().split(".");
    return (x.length>2)?(objExistsFilter(views[x[0]][y]))?views[x[0]][y]:views[y]:views[y];
  };

  viewsService.returnViews = function() {
  return views;
  };

  return viewsService;
}).

filter('objExists', function () {
  return function (property) {
    try {
      return property;
    } catch (err) {
      return null
    }
  };
});

services.js

config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
  $locationProvider.html5Mode(true);
  $routeProvider.when('/', {
    template: 'home'
  });
  $routeProvider.when('/contact', {
    template: 'contact'
  });
  $routeProvider.otherwise({redirectTo: '/'});
}])

controller('AppController', ['$scope','Views', function($scope, Views) {    
  $scope.$on("$routeChangeSuccess",function( $currentRoute, $previousRoute ){
    $scope.page = Views.returnView();
  });

  $scope.returnView = function(partial){
    return Views.returnView(partial);
  }    

}])

factory('Views', function($location,$route,$routeParams,objExistsFilter) {  

  var viewsService = {};
  var views = {
    subdomain1:{
      'home':'/views/subdomain1/home.html'
    },
    subdomain2:{

    },
    'global.header':'/views/global.header.html',
    'global.footer':'/views/global.footer.html',
    'home':'/views/home.html',
    'home.carousel':'/views/home.carousel.html',
    'contact':'/views/contact.html',
  };

  viewsService.returnView = function(partial) {
    var y = (typeof partial === 'undefined')?$route.current.template:partial;
    var x = $location.host().split(".");
    return (x.length>2)?(objExistsFilter(views[x[0]][y]))?views[x[0]][y]:views[y]:views[y];
  };

  viewsService.returnViews = function() {
  return views;
  };

  return viewsService;
}).

filter('objExists', function () {
  return function (property) {
    try {
      return property;
    } catch (err) {
      return null
    }
  };
});

filters.js

config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
  $locationProvider.html5Mode(true);
  $routeProvider.when('/', {
    template: 'home'
  });
  $routeProvider.when('/contact', {
    template: 'contact'
  });
  $routeProvider.otherwise({redirectTo: '/'});
}])

controller('AppController', ['$scope','Views', function($scope, Views) {    
  $scope.$on("$routeChangeSuccess",function( $currentRoute, $previousRoute ){
    $scope.page = Views.returnView();
  });

  $scope.returnView = function(partial){
    return Views.returnView(partial);
  }    

}])

factory('Views', function($location,$route,$routeParams,objExistsFilter) {  

  var viewsService = {};
  var views = {
    subdomain1:{
      'home':'/views/subdomain1/home.html'
    },
    subdomain2:{

    },
    'global.header':'/views/global.header.html',
    'global.footer':'/views/global.footer.html',
    'home':'/views/home.html',
    'home.carousel':'/views/home.carousel.html',
    'contact':'/views/contact.html',
  };

  viewsService.returnView = function(partial) {
    var y = (typeof partial === 'undefined')?$route.current.template:partial;
    var x = $location.host().split(".");
    return (x.length>2)?(objExistsFilter(views[x[0]][y]))?views[x[0]][y]:views[y]:views[y];
  };

  viewsService.returnViews = function() {
  return views;
  };

  return viewsService;
}).

filter('objExists', function () {
  return function (property) {
    try {
      return property;
    } catch (err) {
      return null
    }
  };
});

index.html

<!doctype html>
<html lang="en" ng-controller="AppController">
<body>
<ng-include src="returnView('global.header')"></ng-include>
<ng-include src="page"></ng-include>
<ng-include src="returnView('global.footer')"></ng-include>
</body>
</html>

---

这是一个迟来的答案，但我自己也遇到了这个问题，但事实证明，Dan的解决方案与ngView指令上的ngAnimate类冲突，并且显示了视图，但ng leave动画将立即应用，并隐藏使用其动态路由打开的视图

我找到了完美的解决方案，它在1.1.5中提供+

在

$routeProvider

中，

templateUrl

值可以是一个函数，并传递路由参数：

app.config(function ($routeProvider) {
$routeProvider
    .when('/:page', {
         templateUrl: function(routeParams){
             return '/partials/'+routeParams.page+'.html';
        }
    })
});

虽然控制器不能作为函数提供，所以我的解决方案是按照通常的

ng controller=“HomeCtrl”

在html模板中提供它

使用此解决方案，我们可以按约定在角度方向布线。

---

我希望这能帮助那些不喜欢手动将每条路线添加到routeProvider中的人。

看看这正是我想要做的，即wordpress或modx风格的网站，但动态路线被拉到了angular中。你能提供一个工作拉链或者我能弄到的东西吗？谢谢@ZurielAndrusyshyn Upvote如果有帮助，源代码在那里是正确的。是否有一个启动项目我应该将其插入？就其本身而言，它似乎是不完整的？@ZurielAndrusyshyn理解框架的基本原理就足以直观地理解这些片段是如何组合在一起的。谢谢，我对angular还不熟悉，并且已经尝试过主干。我正在做一些事情，我想你已经弄明白了。如果不太麻烦的话，你能给我发电子邮件吗？我的联系信息在我的个人资料页面上。谢谢我给了这个a+1，因为它正是我想要的，唯一缺少的是处理丢失模板的方法，即等效于.Others（），因为它将捕获所有路由。有什么想法吗？我只是在谷歌上搜索得到了这个。这确实很有魅力。但我想知道一件事。所以当我们点击一个锚点标签时，href作为参数传递到url？我们用路线图传递参数？