什么是Angular的工厂

问题描述 投票:2回答:2

我正在阅读Max NgWizard K的article,关于Angular如何更新DOM。我遇到了以下情况:

对于应用程序中使用的每个组件,Angular编译器都会生成一个工厂。当Angular从工厂创建组件时,Angular使用此工厂来实例化View Definition,而View Definition又用于创建组件View。在引擎盖下,Angular将应用程序表示为视图树。

在Max NgWizard K的another article中,我找到了工厂的定义:

工厂描述组件视图的结构,并在实例化组件时使用。

我不太确定这是什么意思。

问题:

  1. Angular(2+)的工厂究竟是什么?
  2. 是否存在开发人员从中了解其工作方式的好处?
javascript angular typescript angular-factory
2个回答
2
投票

Angular(2+)的工厂究竟是什么?

工厂是Gang of Four提到的设计模式之一(基本上他们写了一本关于他们发现的设计模式的书)。

设计模式帮助程序员以特定方式解决常见的开发任务。

在这种情况下,Factory模式有助于实例化和创建对象。

它也被称为虚拟构造函数。


想一想,像这样:

假设您正在制作2D射击游戏,并且您必须从枪管中射出子弹。

每次触发扳机时,您都可以使用工厂制造子弹,即new Bullet(),而不是像WeaponsFactory.createInstance(BulletTypes.AK47_BULLET)那样实例化子弹。

它变得高度可扩展,因为您所要做的就是更改枚举,工厂将为您完成。

您不必手动实例化它。


这就是角度所做的,它会自动创建所有组件的工厂。这使其工作更轻松。

是否存在开发人员从中了解其工作方式的好处?

您不必知道Factory的内部工作方式就可以使用Angular,但它对于动态创建组件非常有用!

例如许多* ngIf或* ngSwitchCase可以由简单的动态生成组件替换

可以像这样动态创建组件:

createComponent(type) {
  this.container.clear();
  const factory: ComponentFactory = this.resolver.resolveComponentFactory(AlertComponent);
  this.componentRef: ComponentRef = this.container.createComponent(factory);
}

参考了解上面的代码:Dynamically Creating Components


1
投票

在这种情况下,“工厂”是ComponentFactory的一个实例,这个类具有实现createFactory method pattern方法。

调用componentFactory.create时(直接或通过ComponentFactoryResolver - 这对动态组件至关重要,正如linked article所解释的那样),创建了新的组件实例。

© www.soinside.com 2019 - 2024. All rights reserved.