AngularJS-使用ng-repeat的动态指令
我花了一段时间试图找到一个优雅的解决方案，而我却找到了一个“可行”的解决方案，它感觉不是最简单或正确的做事方式。
所以，我的问题是…如何动态加载指令！在某些情况下，以下是我希望我能摆脱它的方式！除了模板加载之外，我没有包含路由或其他任何内容，而是为下面的控制器分配了ng-
controller。
app.js
angular.module('myApp', [])
.controller('someController', ['$scope', function($scope) {
$scope.directives = ['myDirectiveA', 'myDirectiveB'];
}])
.directive('myDirectiveA', function() {
return {
template: '<p>Directive A, exciting.</p>'
};
})
.directive('myDirectiveB', function() {
return {
template: '<p>Directive B, equally as exciting.</p>'
};
});
template.html
<div ng-controller="someController">
<div ng-repeat="directive in directives">
<x-directive></x-directive> // Attempt 1
<x-{{directive}}></x-{{directive}}> // Attempt 2
<{{'x-' + directive}}></{{'x-' + directive}}> // Attempt 3
</div>
</div>
任何人都可以提供的建议将不胜感激，如果我做任何明显愚蠢的事情，对不起，这是我第一次参加Angular！
问题答案：
我希望这对您有帮助：
解释：要在其他指令（例如ngRepeat或其他自定义指令）中使用它时，必须$ compile指令…
angular.module('myApp', [])
.controller('someController', ['$scope', function ($scope) {
$scope.directives = ['my-directive-a', 'my-directive-b'];
}])
.directive('directive', function ($compile) {
return {
restrict: "A",
scope: {
set: "="
},
link: function (scope, element) {
element.html("<div class=\" "+ scope.set +" \"></div>");
$compile(element.contents())(scope);
}
};
})
.directive('myDirectiveA', function () {
return {
restrict: "C",
template: '<p>Directive A, exciting.</p>'
};
})
.directive('myDirectiveB', function () {
return {
restrict: "C",
template: '<p>Directive B, equally as exciting.</p>'
};
});
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<title></title>
</head>
<body ng-controller="someController">
<div ng-repeat="directive in directives">
<div directive set="directive"></div>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.8/angular.min.js"></script>
</body>
</html>
-
Angularjs ng用div标记重复。。我有一个带有div标记的代码，如图所示。。我想重复整个div，在第二个循环中img src是不同的。。如何使用angularjs中的ng repeat指令执行此操作？
-
问题内容： 我正在尝试根据当前项目动态显示ng-repeat指令中的多个模板之一。 我的JSON数据如下所示： 我的目标是动态渲染数据树，每个组包含多个部分。这些组都将具有相同的模板，但是每个部分都应基于名称字段具有自己的模板。 假设顶层HTML是： 理想情况下，每个部分还需要具有自己的范围数据和与其关联的控制器。我很幸运用Knockout构建了这种类型的系统，但是我想了解Angular的做事方式
-
我有一个动态JSON，其中包含名称列表，它还包含子名称作为子集。如何使用angularJS ng重复在超文本标记语言UI中显示它 示例动态JSON是 注意:JSON是基于请求生成的。子数组是可选的，它可以包含长度“n”
-
问题内容： 如何在ng-repeat中使用动态名称命名表单？ 我想动态命名每种形式。例如，将$ index添加到表单名称。我该如何实现？我在ng-repeat上尝试了ng-init，但是没有用。 问题答案： 您可以这样做： 编辑 ： 您也可以使用，如下所示： 如果仅基于表单的有效性应用类，则可以将样式应用于自动添加的类，例如：
-
问题内容： 我正在尝试在ng-repeat中动态添加不同的指令，但是输出没有被解释为指令。 我在这里添加了一个简单的示例：http : //plnkr.co/edit/6pREpoqvmcnJJWzhZZKq 控制器： 指示： HTML： 如何通过ng-repeat 使角度拾取在中指定的指令？ 问题答案： 我知道这是一个老问题，但是google将我带到了这里，但我不喜欢这里的答案。所以我创建了这个
-
问题内容： 我正在尝试将$ sce.trustAsHtml（）与ng- repeat中的对象属性一起使用。结果是HTML完全空白。不过，使用ngSanitize可以正确输出HTML。 顺便说一下，我正在使用AngularJS v1.3.0-beta.3。不知道是否有错误或我做错了什么。 问题答案： 您不能在表达式中使用（除非是的属性），因为表达式是在的上下文中求值的。 最干净的方法是使用。 第二种