Angular 1.5和新的组件路由器

pau*_*oya 14 angularjs angular-new-router

我正在使用angular 1.5 beta 2和来自Angular 2 alpha 45的新路由器.
我找不到使用Angular 1的最新路由器
的使用示例.我可以找到使用Angular 2的路由器的使用示例@RouteConfig.

有人可以解释我如何配置角度1控制器吗?并且,如果可能的话,一个完整的工作示例?

pau*_*oya 14

更新他们已停止使用此版本的路由器,并启动了具有不同API的版本3.截至2016年6月20日,没有推荐使用路由器v3和Angular 1的方法.我不确定自那以后是否已经改变.下面的问题和答案涉及路由器v2(又名ComponentRouter).


过时的API
一些站点表明Angular 1中的组件(出于新路由器的目的)是一个注册的控制器[name]Controller和从中获取的模板component/[name]/[name].html.这已经过时了.

新API
讨论包含最新信息,解释如何获取最新的Angular 1新路由器版本.

配置中使用的组件映射到使用组件名称注册的指令.请参阅此示例.

angular.module('app.home', [])
.directive('home', function() {
  return {
    template: 'Hello {{ home.text }}',
    controller: function HomeController() {
      this.text = 'World';
    },
    controllerAs: 'home'
  }
});
Run Code Online (Sandbox Code Playgroud)

使用Angular 1.5,有一个用于注册组件的新语法,请参见此处.我已经用这个语法了:

angular.module('app.home', [])
.component('home', {
  restrict: "EA",
  template: 'Hello {{ home.text }}',
  controller: function HomeController() {
    this.text = 'World';
  }
  // to configure a child route
  //,$routeConfig: [
  //  { aux: "/son", component: "son", as: "Left" },
  //  { aux: "/daughter", component: "daughter", as: "Left" }]
});
Run Code Online (Sandbox Code Playgroud)