Question

使用多个嵌套视图和ControllerAs时遇到问题

这是我的coffescript和模板的例子

国：

  .state "users" ,
    abstract: true,
    url:"/users",
    views:
      "MainLayout":
        templateUrl:"users.html",
  .state "users.add" ,
    url:"/users-add",
    views:
      "ContentLayout":
        templateUrl:"users-add.html",
        controller:"UsersAddController",
        contollerAs:"formctrl",
      "SideLayout":
        templateUrl:"users-side.html",
    cache: false
  .state "users.list" ,
    url:"/users-list",
    views:
      "ContentLayout":
        templateUrl:"users-list.html",
        controller:"UsersController",
        contollerAs:"userlist"
      "SideLayout":
        templateUrl:"users-side.html",
    cache: false

users.html

<div class="content" ui-view="ContentLayout"></div>
<div class="side" ui-view="SideLayout"></div>

用户-list.html

{{ userlist.result }}

用户-add.html

{{ formctrl.addresult }}

用户-side.html

<menu>
<a ui-sref="users.list">List</a>
<a ui-sref="users.add">Add</a>
</menu>

UsersController作为样本

(->
  UsersController = ()->
    vm = @
    vm.result = "Result"
    return vm
  angular
  .module("myapp")
  .controller("UsersController", UsersController))()

这根本不起作用，但是如果我使用$ scope，所有正常工作。我做错了什么？

Answer 1

在子视图上，您将覆盖父视图，因此您必须使用@ simbol试试这个：

.state "users.add" ,
    url:"/users-add",
    views:
      "ContentLayout@":
        templateUrl:"users-add.html",
        controller:"UsersAddController",
        contollerAs:"formctrl",
      "SideLayout@":
        templateUrl:"users-side.html",
    cache: false
  .state "users.list" ,
    url:"/users-list",
    views:
      "ContentLayout@":
        templateUrl:"users-list.html",
        controller:"UsersController",
        contollerAs:"userlist"
      "SideLayout@":
        templateUrl:"users-side.html",

好的，现在我看到了你的傻瓜，因为你在ui-views中使用了ui-views，你必须包含什么样的ovrwride或target：

state "users.add" ,
    url:"/users-add",
    views:
      "ContentLayout@users":
        templateUrl:"users-add.html",
        controller:"UsersAddController",
        contollerAs:"formctrl",
      "SideLayout@users":
        templateUrl:"users-side.html",
  .state "users.list" ,
    url:"/users-list",
    views:
      "ContentLayout@users":
        templateUrl:"users-list.html",
        controller:"UsersController",
        contollerAs:"userlist"
      "SideLayout@users":
        templateUrl:"users-side.html",

所以我在用户状态下定位ContentLayout'@'。

这是你固定的弹药http://plnkr.co/edit/vPdjntVJn9dVE9Y7mkm3?p=preview

希望有所帮助

Answer 2

正如Sudakatux在评论中所说，有一个issue on angular-ui-router github

Soooo，我切换到另一台路由器，使用Coffee和控制器As正常工作（必须返回@）。

否则，您必须重构您的应用程序 - 使用普通js或使用模板中的ng-controller创建

Angulart ui-router Multiply views和ControllerAs

2 个答案: