Javascript 角度定向动态控制器

我的任务是创建一组“卡片”，比如在GoogleOne和其他类似的网站上使用AngularJS作为仪表板。每个卡都有独立于其他卡的功能，它们都必须在从API返回数据后立即显示。在未来，我们将允许将这些卡固定/取消固定到仪表板，以及由用户定制订单

我已经创建了一个“card dealer”指令，该指令将为一系列卡对象中的每一张卡包含一个ng repeat。每个卡都需要有自己的动态模板和控制器，这就是我遇到的问题。我能够理解如何传入动态

模板URL

，但控制器是另一回事。通过模仿我在Pluralsight视频上观看的内容，我几乎已经了解了这一点，我应该能够将

card.controller

变量传递到指令“ctrl”属性中，如下所示：

<card-dealer ng-repeat="card in cards" card="card" ctrl="{{card.controller}}"/>

但是，在将指令中的

ctrl='{{card.controller}}'

变量发送到指令之前，未对其进行分析。在指令中，我通过设置

controller:'@'

和

name:'ctrl'

动态设置控制器。这将查找名为“ctrl”的属性的元素，并将其值作为控制器的名称返回。当我输入指令控制器的字符串名称而不是使用

{{card.controller}}

变量时，此方法会起作用，但简单地键入字符串不是动态的

我需要在变量到达指令之前对其进行解析，以便它查找正确的控制器名称。我已经创建了一个JS提琴来演示我的问题：。这将返回两个警报框，一个代表每个指令控制器。如果您当前运行此命令，您将在控制台日志中看到它正在尝试使用变量名而不是变量值搜索控制器

---

请帮忙！！这对我们整个仪表板的未来至关重要，一旦我们知道如何传递动态控制器名称，我们将是黄金。提前感谢

就是这样做的：

---

在指令中，您所需要的只是一个属性，该属性允许您访问卡的名称：

在我的示例中，“我的卡”属性包含一个具有name属性的卡对象。在指令中，您将隔离作用域设置为：

scope:{card:'='}

这将隔离卡对象并将其插入指令作用域。然后将指令模板设置为：

template:”

，这将在指令的控制器中查找名为getTemplateUrl的函数。这是您想要的，因为指令控制器可以访问范围对象。在指令控制器中，getTemplateUrl函数如下所示：

控制器：['$scope'，'$attrs'，函数（$scope，$attrs）{
$scope.getTemplateUrl=函数（）{
返回“/View/Card？cardName=”+$scope.Card.name；
};
}]，

---

我有一个mvc控制器，它连接正确的.cshtml文件，并在该路由被击中时处理安全性，但这也适用于常规角度路由。在.cshtml文件中，只需将

作为根元素，即可设置动态控制器。每个卡的控制器将不同。这将创建一个控制器层次结构，允许您将附加逻辑应用于所有卡，然后将特定逻辑应用于每个卡。我仍然需要弄清楚我将如何处理我的服务，但这种方法允许您使用仅基于卡名的ng repeat为指令创建动态templateUrl和动态控制器。这是实现此功能的一种非常干净的方式，并且它是自包含的