我有一个角度应用程序，列出了用户要服务的项目，一个待办事项列表。每个待办事项都需要不同的字段来完成任务。制作待办事项清单很简单。我的问题是如何让每个待办事项扩展以显示一组不同的“子部分”？见下图：
+---------------------------------------------------------+
| To do #1 |
+---------------------------------------------------------+
| To do #2 |
+---------------------------------------------------------+
| To do #3 |
+---------------------------------------------------------+
用户点击以展开第一个待办事项：
+---------------------------------------------------------+
| To do #1 |
| |
| +--------------+ +--------------+ +--------------+ |
| | partial A | | partial B | | partial C | |
| +--------------+ +--------------+ +--------------+ |
+---------------------------------------------------------+
| To do #2 |
+---------------------------------------------------------+
| To do #3 |
+---------------------------------------------------------+
用户扩展第二个待办事项：
+---------------------------------------------------------+
| To do #1 |
+---------------------------------------------------------+
| To do #2 |
| |
| +--------------+ +--------------+ +--------------+ |
| | partial A | | partial D | | partial E | |
| +--------------+ +--------------+ +--------------+ |
+---------------------------------------------------------+
| To do #3 |
+---------------------------------------------------------+
通常，其中一个子部分可能有3-10个字段。请注意，其中一些是重复使用的，但每个待办事项中的一些会有所不同。我希望有大约30个子部分。
这样的事情可以在Angular中以干净的方式进行吗？我一直在寻找ui-router，但我不知道它可以为每个待办事项做不同的设置。还有其他方法或更好的方法吗？欢迎任何建议。
如果可能的话，我也想动态加载控制器，但这是次要的主要目标。
如果有必要，我可以在模态弹出对话框中显示所选的待处理子部分，而不是展开。
答案 0 :(得分：1)
我在上一个应用中所做的是设置我想要加载为$scope变量的子部分的名称，然后在ng-include中使用该变量。
.when('/team/:team', {
'template': "<div ng-include=\"nav.template\"></div>",
'controller': 'TeamCtrl',
}
然后在我的控制器某处：
$scope.nav.template = 'app/partials/team/' + $routeParams.team + '.html';
这让我可以快速扩展想要链接的团队数量，而无需更改我的代码并单独添加每个团队。我认为这个逻辑可以扩展到符合你的要求。
请注意，在我的示例中，整个事情都在路由器中设置，但您也可以从控制器执行此操作，并将动态ng-include设置在另一个部分内。