Javascript 何时使用@Input，何时不使用angular2

我是安格拉尔的新手。试图更好地理解

@Input

的用法。我们可以使用

@Input

将值从父组件传递给子组件，还可以创建服务变量并将其注入父组件，并可以在子组件中访问它们。哪条路更好？我通过路由解析得到这些值。当@Input与用户输入没有绑定时，我对使用@Input感到怀疑。

我只是猜测，但它取决于用例

如果您的子组件的行为类似于无状态组件，但依赖于父容器具有类似状态的访问权限的数据，那么您可能希望使用输入将数据传递给子组件

例如，我想到的一个例子是表单组和表单控件的使用 容器跟踪表单组逻辑/状态的排序，如果表单是被动的，则在提交时会将数据对象发送回或至少应该发送回

我自己并不熟悉，但输入的用例是当您只渲染需要从父容器引用一些数据的可视组件时才有意义的

希望这是有道理的或者至少说明一个用例，呵呵

“大多数开发人员需要知道如何将数据传递到组件以动态配置它们。”

---

另一个很好的图形指南：

准确地说，

@Input（）

与您认为的用户输入无关。它主要用于将数据从

父组件

传递到

子组件

。我同意名称

Input（）

会引起混淆，但其用法不同。说到

服务

注入，这与

父子关系

无关。任何层次结构中的组件都可以根据需要独立注入

服务

。总之，将数据从父级传递到子级的最佳方法是使用

@Input（）

通常有两种类型的组件-表示组件和容器组件，有时也称为有状态组件和无状态组件。以下是专家对差异的解释：

表象成分：

• 他们关心事物的外观
• 仅通过props接收数据和回调
• 很少有自己的状态（如果有，则是UI状态而不是数据）

容器组件：

• 他们关心事物如何运作
• 向presentational或其他容器组件提供数据和行为
• 通常是有状态的，因为它们往往用作数据源

---

表示组件应该通过输入绑定以声明方式接收尽可能多的数据。容器组件应该尽可能多地使用DI。

在我的用例中，没有输入控件或表单从用户那里获取数据。因此，我希望删除@Input以传递数据，而不是使用服务变量并将其注入所需的子组件。如果存在父子关系，通常最好使用

@Input

imo，因为您可以使用

OnPush

更改检测策略，并降低更改检测系统的负载。您不认为使用@Input会创建一个双向绑定，而在我的情况下，这实际上并不需要。这可能是性能下降。不

@Input（）

是单向绑定，如果传递对象，那么它将变成双向绑定，因为对对象的引用保持不变。除了object之外的任何东西都是单向绑定。我认为在元素中[somedata]创建单向绑定，[（somedata）]创建双向数据绑定。我试着编辑我的第一条评论，但没有成功。无论哪种方式都会有绑定。是的，`[（somedata）]`进行两个绑定。但是我认为你不能为

Input（）

property做“[（somedata）]”。我想这是无效的。嗨，Maximus，如果我们在angular2中为容器组件使用@Input，您看到了什么缺点吗。这两种方法似乎都没有坏处。我在回答中所展示的只是一种看待事物的方法，使用容器组件的输入也可以