在angularjs中动态注入路径

时间:2013-08-13 19:39:28

标签: angularjs angularjs-routing

我正在使用angular来动态创建另一个角度应用。我想知道是否有一种动态注入路由的方法。像

这样的东西
angular.module('app').controller('CreateCtrl', function ($scope,$routeProvider) {
  var count = 0;

  $scope.addPage = function(){  
    $routeProvider.when('/'+count, {
       templateUrl: 'views/created.html',
       controller: 'CreatedCtrl'
     });
    count++;
  };

});

我知道这段代码很傻但我希望它能传达我想要做的事情。当用户与应用程序交互时,他/她将创建新路线......这可能吗?

1 个答案:

答案 0 :(得分:0)

有两种方法:

选项1

直接修改routes对象,如https://stackoverflow.com/a/13173667/17815

中所述
$route.routes['/dynamic'] = {templateUrl: 'dynamic.tpl.html'};

注意:您需要添加“/ newurl”和“/ newurl /”(带斜杠)。 看角度代码:

this.when = function(path, route) {
routes[path] = extend({reloadOnSearch: true}, route);

// create redirection for trailing slashes
if (path) {
  var redirectPath = (path[path.length-1] == '/')
      ? path.substr(0, path.length-1)
      : path +'/';

  routes[redirectPath] = {redirectTo: path};
}

return this;
};

选项2

您可以保留对$routeProvider

的引用
var $routeProviderReference;
var app = angular.module('myApp', ['myApp.controllers']);

app.config(['$routeProvider', function($routeProvider) {
    $routeProviderReference = $routeProvider;
}]);

请参阅http://blog.brunoscopelliti.com/how-to-defer-route-definition-in-an-angularjs-web-app

这会污染全局命名空间,但您仍然使用该接口来改变routes对象。我想这使得维护更容易。 也许你可以试着把它放在封闭处。

在任何情况下,请记住,您需要在提供程序中执行此操作以使应用程序健壮。 “使用前定义”。