Angular 如何将变量传递给子组件？

我目前正在学习angular2，ang-book2建议，要将变量传递给子组件，我应该：

在父视图中（父应用程序ts中定义的随机编号）：

这将导致控制台中的输出未定义

另一方面，这里 它们使用@Input将var传递给子元素

---

第二种选择似乎对我有效，但我想知道为什么。无论是本书还是上面的页面都没有解释第一个方法导致未定义的差异或原因。

在

@Component（）

配置对象上使用

@Input（）

数组应该与将

@Input（）

装饰器添加到属性AFAIK相同，这不是你的代码不能工作的原因

相反，您的问题是在构造函数中检查属性是否设置得太早

相反，检查

ngOnInit（）

方法内部，应该已经为您设置了属性

发件人：

ngOnInit
首先显示数据绑定属性并设置指令/组件的输入属性后，初始化指令/组件

在第一次Ngonchange之后调用一次

---

如果要如图所示绑定子属性，则必须使用

@Input（）

decorator注释子属性。如果子属性未使用

@Input（）

decorator进行修饰，则它一定是书本中的错误

明白了，这本书对事件流的描述不一致。如果我使用输入，我不必像其他用户建议的那样使用@Input（）注释，对吗？它的功能相同，语法不同？我相信是的。不过，我在消息来源中找不到证实这一点的地方。大多数使用Typescript的人都使用

@Input（）

装饰器，因此人们倾向于认为这是唯一的方法。但是他们需要一种方法来做到这一点，这样它就可以在没有Typescript的情况下工作（不管多么痛苦），所以所有的装饰程序都有一个简单的JS等价物<代码>@Input（'randomNumber'）掩码：数字@输入（'anotherRandomNumber'）anotherMask:number然后在组件类

console.log（

${mask}和${anotherMask}

）中或者有更好的方法来编写它？在我谦逊的新手看来，我发现的所有示例都使用相同的变量名来解释输入，这令人困惑。像
@Input（）英雄：英雄@输入（“主”）主名称：字符串是，您需要为每个输入属性指定
@Input（）
。同名的原因通常是因为你还会叫它什么？虽然我可以看到潜在的混乱。要考虑的是，<>代码>英雄< /代码>是指每次。在您的示例中，
[hero]=“hero”
读作“hero child的hero输入属性设置为
heros
数组中的当前条目”。这有用吗？
<app-child
 [passedToChild] = "random_number"
></app-child>

import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-child',
  templateUrl: './child.component.html',
  styleUrls: ['./child.component.css'],
  inputs: ['passedToChild']
})
export class ChildComponent implements OnInit {
  passedToChild :number;

  constructor() { console.log(this.passedToChild)}

  ngOnInit() {
  }

}