Question

有没有办法传递在运行时定义的组件来渲染Angular 1中的另一个组件？这是React库的一个相当常见的模式，但我无法弄清楚它在Angular中是如何工作的。

这是一个React示例：

  const List = ({items, ListItem=DefaultListItem}) => {
    return (
      <ul>
        {items.map((item) => (
          <ListItem key={item.id} item={item}/>
        ))}
      </ul>
    );
  }

  // Then later on, you'd define a custom list item:
  <List items={items} ListItem={CustomListItem}/>

我知道使用ng-transclude和ng-include在Angular 1中定义动态子项的一些方法。但是这些方法在迭代遍历每次迭代渲染一个自定义组件的数组的上下文中不起作用。你会如何通过Angular实现这一目标？

Answer 1

这个确切问题的解决方案是使用ngRepeat指令。这是一个如何的例子：

<ul ng-repeat="obj in collection track by $id(obj)">
    <li>{{obj.prop}}</li>
</ul>

如何将动态组件传递给Angular 1中的容器组件

1 个答案: