加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 综合聚焦 > 服务器 > 安全 > 正文

Angular 2 / TypeScript:@ Input / @输出或输入/输出?

发布时间:2020-12-17 10:19:48 所属栏目:安全 来源:网络整理
导读:在Udemy上做一门课程的时候,我们一直允许组件使用组件类中的@Input()装饰器传递数据. 在通过ngBook-2阅读时,我发现在@Component装饰器中使用input属性还有另一种方法. 关于SO的THIS个类似的问题,一个人回答: One advantage of using inputs is that users o
在Udemy上做一门课程的时候,我们一直允许组件使用组件类中的@Input()装饰器传递数据.

在通过ngBook-2阅读时,我发现在@Component装饰器中使用input属性还有另一种方法.

关于SO的THIS个类似的问题,一个人回答:

One advantage of using inputs is that users of the class only need to look at the configuration object passed to the @Component decorator to find the input (and output) properties.

并通过documentation状态看:

Whether you use inputs/outputs or @Input/@Output the result is the same so choosing which one to use is largely a stylistic decision.

实际上,最有用的信息主要是相互矛盾的,具体取决于你的外观.

在@Component里面

@Component({
  selector: 'product-image',inputs: ['product'],template: `
  <img class="product-image" [src]="product.imageUrl">
})

class ProductImage {
  product: Product;
}

内部课程

@Component({
  selector: 'product-image',template: `
  <img class="product-image" [src]="product.imageUrl">
})

class ProductImage {
  @Input() product: Product;
}

我想知道的事情

>更多的是“最佳实践”用法?
>你什么时候用一个而不是另一个?
>有什么不同吗?

角度2风格指南

根据官方Angular 2 style guide,STYLE 05-12说

Do use @Input and @Output instead of the inputs and outputs properties of the @Directive and @Component decorators

好处是(来自指南):

>识别类中的哪些属性是输入或输出更容易,更易读.
>如果您需要重命名与@Input或@Output关联的属性或事件名称,则可以将其修改为单个位置.
>附加到指令的元数据声明更短,因此更具可读性.
>将装饰器放在同一行上可以缩短代码,并且仍然可以轻松地将属性标识为输入或输出.

我个人使用这种风格,非常感谢它帮助保持代码DRY.

(编辑:李大同)

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

    推荐文章
      热点阅读