typescript – Angular2 @Inputs应该是公共的还是可以/我们应该

发布时间：2020-12-17 17:41:50 所属栏目：安全来源：网络整理

导读：我正在使用带有Typescript的Angular2 假设我的app组件模板中有以下内容： ... coffee-cup [coffee]=""... 我的咖啡杯组件： @Component({ selector: 'coffee-cup',...})export class CoffeeCup { @Input() public coffee = 0;} 我目前不确定我的输入应该是什

我正在使用带有Typescript的Angular2

假设我的app组件模板中有以下内容：

... 
<coffee-cup [coffee]=""
...

我的咖啡杯组件：

@Component({
  selector: 'coffee-cup',...
})
export class CoffeeCup {

  @Input() 
  public coffee = 0;

}

我目前不确定我的输入应该是什么样子.它可能看起来像这样：

@Input()
public coffee = 0;

要么

@Input()
private coffee = 0;

我目前倾向于将成员变量咖啡私有化.

>我想为组件定义一个清晰的公共API
>我只想通过模板公开设置coffee属性
>我目前没有任何理由允许直接从父组件读取或设置咖啡.如果需要,我可以删除私有修饰符.

我查看组件的方式是有两个单独的API与之交互：

>模板API,由@Inputs和@Outputs组成
> Typescript API,包含所有公共属性和方法

我没有检查在下列情况下发生了什么,但是,它可能会改变答案：

>假设咖啡成员是公开的.如果我的appComponent使用@ViewChild访问CoffeeCup并设置咖啡成员,生命周期挂钩(如ngOnChange)会触发吗？

重申一下这个问题：Angular2 @Inputs应该是公开的,还是应该通过将它们设为私有来实现更严格的API？

解决方法

首先,从API设计的角度来看,@ Input意味着公开.从角度来看也是如此,这些装饰器描述了与组件交互的接口.

@Input装饰器或任何其他元装饰器由角度使用,让角度知道您的意图,并更好地理解模板及其与组件类的关系.

在某些情况下,它也被变化检测引擎使用.例如,@ Input是由更改检测跟踪的字段,它向CD引擎提示应该监视此属性.

拥有带@Input装饰器的私有属性不应该在运行时有任何影响.这个修饰符是虚拟的,它在TypeScript到JavaScript编译后消失了.

但是,根据您的环境,可能会出现一些影响：

一般来说,使用TypeScript和元数据的一大好处就是拥有一个智能IDE,这意味着IDE可以在您编写代码时为您提供帮助.拥有私有属性可能会也可能不会影响它,具体取决于每个IDE的实现.
在属性上使用@Input将导致IDE在您为该组件编写HTML标记时在智能感知窗口上显示该属性.

另一个风险因素是未来对打字稿中的缩小/丑化的支持.
顾名思义,私人财产在其他地方使用.这种特性意味着编译器可以更改私有属性的名称,因此它们占用更少的字节,这也使它们“更私密”,因为标识符可能会从构建更改为构建.例如：private mySpecialProperty：minification之后的字符串将是p1,编译器将更改类中对此标识符的所有引用以匹配p1.
因此,今天有这个可行,但将来它可能会限制构建功能.

需要考虑的另一点是,虽然angular不关心编译器所做的修饰符,但动态组件创建将受到限制.
换句话说,在html标记中创建组件将没有任何问题,但使用ComponentResolver动态创建组件 – > ComponentFactor将受到限制,因为您无法使用代码将这些输入分配给组件实例.
如果你不打算这样做,那你很好.

If you’re building components to be used by others,public modifier is mandatory for @Input/@Output. The users of you’r component should be able to dynamically create your components.

这也回答了关于在父/子组件上访问这些属性以获取对咖啡组件的引用的问题.只能通过模板标记进行绑定.例如,您将无法手动注册到咖啡组件上注册的EventEmitters.这有时是必需的,请参见THIS场景作为一个示例.

至于生命周期钩,它不应该有任何影响,因为角度不检查类型,但进行存在检查.

因此,总而言之,在大多数用例中你不应该有任何问题,但随着你的应用程序的进展,你可能会解决一些问题,或者没有.您可能还需要在将来选择退出高级缩小功能……

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!