我有一个组件MyNodeComponent，该组件将target HTML元素作为input对象的一部分：
@Component({
selector: 'my-node',
templateUrl: './my-node.component.html'
})
export class MyNodeComponent implements OnInit, OnChanges, AfterViewInit {
@Input() inputObject: [{target: HTMLElement, desc: string}];
...
}
问题是我不确定如何以动态方式发送HTML DOM节点来定位。特别是因为页面上可能存在具有不同层次关系的MyNode的多个实例：
<body>
<my-node [inputObject]="inputObjectDefinition"></my-node> <!-- target should refer to target1 -->
<p id="target1" #target1>Hello</p>
<div id="target2" #target2>
</div>
</body>
我将如何定义inputObjectDefinition以包含来自打字稿组件内部对target1和target2的引用？我是否使用document.getElementById（它始终返回null，但可能使用了错误）？其他方式？
要回答强制性的“您为什么要这样做？”实际上，我的问题是MyNodeComponent被用来将dom节点发送到html2Canvas库，以便我可以将页面的一部分或一部分呈现为图像。
[看一下Angular的ElementRef（https://angular.io/api/core/ElementRef）。这使您可以访问DOM中的Element。
您可以在这里看到实际效果；https://stackblitz.com/edit/angular-elementref-example