Angular使用$event.target和ViewChild...is有什么区别吗？
我经常发现自己想要禁用一个按钮，一旦它在表单上被按下。所以我这样做：
<button (click)="complete($event.target)">然后在我的typescript文件中将其关闭，直到操作完成，如下所示：
complete(button: HTMLButtonElement): void {
button.disabled = true;
this.service.doSomething.subscribe(..., ..., () => button.disabled = false);
}我可以通过标记按钮，然后使用ViewChild来实现完全相同的功能。除了个人偏好之外，有没有一个很好的理由使用其中一个而不是另一个呢？
回答 1
Stack Overflow用户
发布于 2018-12-13 04:16:32
@ViewChild主要用于当你需要一个组件的实例和它的属性时，通常作为一个父组件从子组件中抽象出一些逻辑。您可以将整个子类作为父类中的一个属性，并可以使用它做任何您想做的事情。它也被用作从DOM中获取DebugElement的一种方法。
模板绑定可以被认为是通过它的"API“与组件进行交互。它使Inputs和Outputs可用于在这些交互可以提供完整功能的情况下使用它的组件。Angular在自己的区域和变化检测周期中处理这些输入和输出。
话虽如此，使用@viewChild获取组件将允许您以与模板绑定相同的方式直接与其交互，尽管通常没有什么理由这样做。
话虽如此，您正在讨论的是提取一个HTML元素的@ViewChild。在Angular中使用shouldn't interact with the DOM directly的原因有很多。该框架将DOM从代码中完全抽象出来，这就是reasons behind that.
我认为最好的做法是让组件代表按钮的状态，并允许Angular为你改变视图：
<button (click)="complete($event.value)" [disabled]="formDisabled">component.ts：
public formDisabled = false;
complete(value: string): void {
this.formDisabled = true;
this.service.doSomething.subscribe(..., ..., () => this.disabled = false);
}这使得Angular可以处理框架内的变化检测和视图渲染，而组件本身则表示状态。
使用NgForms可以更灵活，因为您可以将disabled属性绑定到表单本身的状态。甚至还有一些用于挂起提交状态和asynchronous validators!的钩子。
https://stackoverflow.com/questions/53750346
复制相似问题