Hub*_*iak 8 javascript angularjs
我有一个对象数组.这些对象中的每一个都具有带有字符串值的"component"属性.现在我想循环遍历列表并呈现每个引用的组件.循环对象的其他属性应该为组件提供参数(下面的示例中不包括).
到目前为止我的解决方案有效,但需要在switch-case中声明允许的元素并创建不需要的包装元素:
angular.module('switchExample', [])
.controller('ExampleController', ['$scope',
function($scope) {
$scope.items = [{
component: "alpha"
}, {
component: "beta"
}, {
component: "alpha"
}];
}
])
.component('alpha', {
template: "this is component alpha",
})
.component('beta', {
template: "this is component beta"
})<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Example</title>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"></script>
</head>
<body ng-app="switchExample">
<div ng-controller="ExampleController">
<div ng-repeat="s in items" ng-switch="s.component">
<alpha ng-switch-when="alpha"></alpha>
<beta ng-switch-when="beta"></beta>
</div>
</div>
</body>
</html>有没有办法在程序上包含组件而不进行字符串比较和显式调用的往返？
也许是这样的事情？:
<div ng-repeat="s in items">
<component ng-component="s.component"></component>
</div>
甚至更好:
<div ng-repeat="s in items" ng-component="s.component"></div>
或者:
<div ng-component="s.component for s in items"></div>
完整文档可在 GitHub 上下载：https ://github.com/hubertgrzeskowiak/angular-component-directive 。
根据我下面的回答，我以一种相当干净和更通用的方式重新实现了它。演示：http://plnkr.co/edit/uDxIUulQPx4C3s11b5cG ?p=preview
用法（请参阅 GitHub 前面的完整文档）：
<component name="expr" args="expr" replace="expt"></component>
...其中“name”表达式必须计算为组件名称（字符串），“args”（可选）必须计算为对象，“replace”（可选）必须计算为布尔值。args 被解包为新组件的属性，因此该对象中的每个值都是一个表达式。如果“replace”为 true，则组件将替换自身。
| 归档时间： |
|
| 查看次数： |
843 次 |
| 最近记录： |