我有以下设置:
应用/指令
var app = angular.module("MyApp", []);
app.directive("adminRosterItem", function () {
return {
restrict: "E",
scope: {
displayText: "@"
},
template: "<td>{{ displayText }}</td>", // should I have this?
link: function(scope, element, attrs){
// What do I put here? I don't seem to have any
// element to initialize (set up event handlers, for example)
},
compile: function(?,?,?){} // should I have this? If so, what goes inside?
}
});
控制者
function PositionsController($scope) {
$scope.positions = [{ Name: "Quarterback", Code: "QB" },
{ Name: "Wide Receiver", Code: "WR" }
];
}
HTML:
<div ng-app="MyApp">
<div ng-controller="PositionsController">
<table>
<tr ng-repeat="position in positions">
<admin-roster-item displayText="{{ position.Name + ' (' + position.Code + ')' }}"></admin-roster-item>
</tr>
</table>
</div>
</div>
这是一个非常简单的示例,但是我无法渲染它。也许有些教程没有告诉我,或者这是Angular的秘密知识?
如果我改为在<tr ng-repeat="..." />
and位置内删除该指令<td>{{ displayText }}</td>
,它将显示所有记录。
但是我希望该指令比仅一个指令<td>{{}}</td>
(最终)要复杂,以便可以在多个应用程序中重用此指令。
所以,我真的在问我们如何正确创建ng-repeat内的指令?我想念什么?上面的代码应该删除什么?
同意您需要考虑该指令的开始和结束位置。下面是说明了数组中绑定到每个项目一个指令一个plnkr -
http://plnkr.co/edit/IU8fANreYP7NYrs4swTW?p=preview
如果您希望该指令封装由父作用域定义的集合的枚举,则会有些麻烦。我不确定以下内容是否是“最佳做法”,但这是我的处理方式-http://plnkr.co/edit/IU8fANreYP7NYrs4swTW?p=preview
当依赖指令执行迭代时,您会涉及到包含,这是一个虚构的词,意味着(据我所知)将父代中定义的内容带入指令中,然后对其进行评估。我已经使用了angular几个月了,而且我开始认为要求迭代指令是一种味道,而且我一直能够围绕它进行设计。
问题内容: 我想在内容更改时创建具有自定义行为的列表。我尝试为此创建一个指令,但是我对如何将ng-transclude与ng- repeat指令结合起来感到迷茫。有人可以让我走上正轨吗? HTML: Javascript: 我已经在这里工作了一部分 编辑: 条件: 该项目的模板必须在视图中定义,而不是在指令中定义,并且必须有权访问子作用域中的项目属性。理想情况下,我想像在ng-repeat指令中那
问题内容: 我已经用orderBy尝试了许多ng-repeat的示例,但是无法使json与它一起工作。 还有JSON 我写什么都没关系,我总是得到相同的顺序,或者我可能说根本没有顺序。 问题答案: 该只适用于阵列-见http://docs.angularjs.org/api/ng.filter:orderBy 也是一个很好的过滤器,用于ng-repeat上的对象而不是数组@ [AngularjsO
问题内容: 我有一张桌子,其中的行通过重复。我正在尝试创建一个模板,为每一行生成列 问题是我的自定义td模板根本没有呈现。在这里,我打算用n个s 代替- 这将根据我的数据对象上的属性数量来确定,但是目前,我只是试图获得一个简单的指令,该指令将输出两列。 MYPLUNKER:显示此问题的一个实例和指令代码。 问题答案: 如注释中所指出,指令模板应具有单个根元素。因此,我建议您将元素移动到指令的模板,
假设我有几个指令:“戏剧”、“喜剧”,出于某种原因,它们有很多不同的属性,所以有一个“电影”指令并不一定有意义。有没有一种方法可以根据范围变量动态评估指令?大致如下: 它的评估结果如下: 我是Angular的新手,所以请原谅疯狂的想法。 更新:实际上我刚刚发现了一篇关于完全相同的问题/解决方案的文章:http://onehungrymind.com/angularjs-dynamic-templa
问题内容: 嗨,我有一个简单的ng-repeat-start和end用例,并且工作正常,当我想添加一个内部ng-repeat时出现了问题。这是我的代码 内部ng-repeat到td元素中不起作用,在检查html源代码时看到ngRepeat注释,但未创建td元素。 我的丑陋的解决方法(假设我知道该向量的大小)是: 问题答案: 从那时起,我不确定是否使用角度1.1.6,并且在1.1.5或1.0.7
Angularjs ng用div标记重复。。我有一个带有div标记的代码,如图所示。。我想重复整个div,在第二个循环中img src是不同的。。如何使用angularjs中的ng repeat指令执行此操作?