Question

我正在尝试为列表中的每个项目分配一个控制器，以便我能够操作列表项数据。显示的信息区分每个项目。

<div ng-repeat="item in items" ng-controller="ItemController">
    {{item.name}}
    <select ng-model="selectedSystem" ng-options="system.name for system in systems">
    <button ng-click="dosomething()">do something</button>
</div>

如何获取ItemController内的项目？我想根据ItemController？

中项目的信息设置列表系统

使用ng-repeat时，我可以将div中的所有内容移动到模板中吗？

谢谢！

Answer 1

我可以使用建议的（@charlietfl和eddiec）指令解决方案解决问题。

Answer 2

在过去的经验中，在数组中为每个项目添加多个控制器可能不是解决问题的最佳方法。你在哪里定义了物品？我假设有一些父控制器，你通过服务请求该数组，或静态定义..

物品控制器内的物品需要什么？您可以访问它，因此您可以将其传递到您的函数“doSomething（）”中，如果这是您想要的路线。

以下是我的控制器的内容。

  $scope.items = [
  {
    name: "Name1",
    systems: [
      {name: 'System 1'},
      {name: 'System 2'},
      {name: 'System 3'}
    ]
  },
  {
    name: "Name2",
    systems: [
      {name: 'System 4'},
      {name: 'System 5'},
      {name: 'System 6'}
    ]
  }
];

$scope.doSomething = function(item){
  console.log(item);
}

以下是我的HTML

的内容

<div ng-controller="someController">
  <div ng-repeat="item in items">
      {{item.name}}
      <select ng-model="selectedSystem" ng-options="system.name for system in item.systems"></select>
      <button ng-click="doSomething(item)">do something</button>
  </div>
</div>

结束结果，给出一个下拉列表，其中包含相应的系统和打印该项目的按钮。我认为每个项目都不需要控制器......

另外，不要忘记遵循缩进规则，并始终使用camelCase为您的功能。更容易阅读;）

结合ng-repeat和ng-controller来渲染项目

2 个答案: