angular - @Input 和 Angular2 Components 中的输入有什么区别？

Question

我正在思考这个问题，找不到任何解释。

在 Angular2 中向组件传递参数时

给定

<my-component [attr]="someModelVariable"></my-component>

似乎有两种接受attr绑定(bind)值的方法:

@Component{(
    selector: "my-component",
    inputs: ["attr"]
)}
export class MyComponent {
}

或者你这样做:

@Component{(
    selector: "my-component"
)}
export class MyComponent {
    @Input()
    public attr: any;
}

而且我确实看到过同时使用两者的代码，谁能解释一下它们之间的区别是什么？

/瑞卡德

Answer 1

虽然 Eric 已经在评论中提供了答案，但我还是要加上我的 2 美分。

使用inputs 的一个优点是类的用户只需要查看传递给@Component 装饰器的配置对象就可以找到输入(和输出)属性。

使用@Input 的一个优点是我们可以定义类型以及它是私有(private)的还是公共(public)的:

@Input() public attr: string;

---

请注意样式指南 recommends使用 @Input:

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