无模板局部变量的Angular 4 access模板元素

我有一个父组件（比如说

ParentComponent

），我需要动态地向它添加许多子组件（比如说

ChildComponent1

，

ChildComponent2

，…

ChildComponentN

）。每个组件都是不同的

我遵循以下步骤来解决我的问题：

但是为了通过

@ViewChild

访问将保存我的

子组件的template元素（一个简单的
），我需要在这个
元素上设置一个模板局部变量

但是，在我的例子中，我不能这样做，因为我不能用动态名称设置模板局部变量。因此，我的
元素只具有一个动态添加的唯一id属性（如
）

是否有任何方法可以通过typescript中的组件实现访问my
元素，而不使用模板局部变量？
我认为您可以创建一个指令
mydir
，该指令将公开一个元素：

@Directive({selector: 'mydir'})
export class MyDir {
  @Input('mydir') id;
  constructor(public vc: ViewContainerRef) {

  }
}

然后将其应用于div：

<div [mydir]="child1">
<div [mydir]="child2">

如果您有angular 4，您可以使用*ngComponentOutlet=“DinamicComponent”以动态方式插入组件
您可以向元素添加指令吗？像
@Maximus是的，我可以向
添加一个指令（但是每个
必须有唯一的东西，才能在右侧
元素下添加正确的
子组件
模板），我认为这是可行的，但是
@ViewChildren
给了我一个
查询列表。我需要一个
ViewContainerRef
，以便在
元素下添加我的子组件模板。您是否知道如何：1）通过指令通过id获取特定的
元素？2） 获取此特定
元素的
ViewContainerRef
。@Dartz，请参阅我的编辑@ViewChildren将为您提供
MyDir
的实例，但在每个实例上您都会找到
vc
，这将是对视图容器的引用，几乎可以正常工作，但由于未知原因，调试器显示指令的id始终未定义（我对指令不太熟悉）。我的IDE在“代码> >输入< /代码>行中发出警告：< Mydir”中的“代码> > [ TSLILT ]，指令输入属性“ID”不应重命名。请考虑以下使用“@输入（）”ID：String“（无输入重命名）< /C>。但是如果我写
@Input（）id:string，我在加载应用程序时出现角度错误：
错误：模板解析错误：无法绑定到“mydir”，因为它不是“div”的已知属性。
@Dartz，
tslint
不是问题。你能展示你的代码吗？我不知道您从哪里得到
child1
和
child2
值问题。我在模板中硬编码了id以简化调试。是的，但我也会遇到同样的问题。事实上，我需要访问父组件的typescript中的子组件，以便设置子组件属性（因为
@Input
和
@Output
还不受
ngComponentOutlet
的支持）。在父组件中使用@ViewChild（），但
@ViewChild
需要一个选择器，这就是我问题的重点。
@ViewChildren(MyDir) children;

ngAfterViewInit() {
   const specificID = 'child1';
   const instance = children.find((c)=>{c.id === specificID});
   const vc = instance.vc;
}