14

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

有人可以解释我将如何配置 angular 1 控制器吗？并且，如果可能的话，一个完整的工作示例？

4

2 回答 2

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'
  }
});

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" }]
});
于 2015-11-12T10:58:11.267 回答
4

尽管此时它还很新，但您也可以将根组件与新的 Angular 路由器一起使用。该组件可以将其他组件作为子组件。

我按照 Pete Bacon Darwin 的例子来获得一个版本。 https://github.com/petebacondarwin/ng1-component-router-demo

注意在他的版本中，主要组件有 $router.config 在 run 块中传递，并用 3 个点标识子项。

.run(function($router) {
    $router.config([
    { path: '/...', name: 'App', component: 'app', useAsDefault: true }
    ]);

我正在使用 angular 1.5.0 来关注他的 github。我在发布一些候选版本时遇到了问题。

于 2016-02-19T17:05:27.273 回答