独角兽企业重金招聘Python工程师标准>>>
翻译：/5-ways-to-pass-data-into-child-components-in-angular 原作者：
前言
如果你是新手，或翻译angularJs的项目代码时，第一个要想的可能是：我如何向周围传值。
本文，让我们跟随accompanying demo app 的示例来阐述下面5个技术：
@Input来响应变化的值@ViewChild来设置属性在services中使用BehaviorSubjects使用Angular Router使用NgRx
我会从最基本的开始，最后整个会变得很复杂。它们每一个技术都能适应众多的场景，但由你来决定你的app中，最终使用哪个技术！
Inputs
Inputs 是最简单最直接的传值到子组件内的方式。只需要添加input 装饰器到相应的属性，如下：
@Input() price:number;
在模板文件中，它只是一个属性，你可以用 [ ] 来绑定它的值，也可以传入静态值。
<my-component [price]="500"></my-component><my-component price="One kajillion dollars"></my-component>
你也可以向属性传入方法，静态值，表达式，你甚至可以传入一个异步的observable管道，它会自动取出其中的值。之后在你的组件中，这个属性能够一直指向最后一次的emitted值。
<my-component [profile]="user$ | async"></my-component>
子组件可以使用ngOnChanges 以及 getter ,setter属性来响应父组件内的变化，仔细看一下例子吧！
ViewChild
使用ViewChild，你可以操作子组件内的属性以及方法。在动态插入组件或元素时，你可以通过子组件的类或模板引用变量的方式，来直接引用子组件，这技术就会得心应手。 要使用ViewChild，需要传入子组件的类或是模板引用变量，这样在父组件内轻易的得到属性指向子组件。
这个声明只会查询组件内第一个PriceComponent的实例：
@ViewChild(PriceComponent) priceComponent;
如果你的模板中使用引用变量：
<app-price-component #price></app-price-component
下面的声明能让你创建一个它的引用
@ViewChild('price') priceComponent;
在服务中使用BehaviorSubjects
BehaviorSubjects是让你在app内部共享数据的一个简单的方式。Observable的模式，让你能随时dgtdv生成父，子组件内的事件，因为它就共用同一个实例。
首先创建一个包含BehaviorSubject的服务，然后添加一个函数，来更新BehaviorSubject。 在组件中注入该服务，然后调用这个函数来更新数据值，以及订阅这个BehaviorSubject，就是这么容易！
比如：
在组件中，注入一个public 的服务变量，
constructor(public service: BitcoinService) {}
触发事件：this.service.augmentValue(val);
在组件的模板中，可以用管道订阅值：<p>{{ service.bitcoinValueSubject | async | currency }}</p>
Router
Router 是一个在app内管理状态的方法，当你点击连接同时Url变化时。当路由到子组件时，可以访问到路由参数：route params，这非常有用。使用路由解析的技术，可以让你在路由中传递有意义的信息！
路由解析器：Route resolvers 是在路由跳转时，会先挂起，直到Observable 返回信息时，才进行路由到页面。
比如：
为了使用这个路由解析器，必须在路由配置中添加：
{
path: ':symbol',
component: PriceComponent,
resolve: { coinData: CryptoResolver }
}
在组件内部使用时，会立即取到数据：
NgRx
NgRx是一个强壮的，功能强大的状态管理系统，它基于redux,它具有响应开发，是一个observable的封装!
在组件内取数据：entities$ = this.store.pipe(select(getAllEntitiesAsArray));
在组件内修改或删除数据：this.store.dispatch(new EntityAction({ entity: this.myEntity }));
在此时，ajax请求会更高效，因为data会缓存，但仍与服务端保持同步更新！在小应用中，NgRx不是必须的，但是当构建一个大的企业级yietjf，它就很好用。
Ngrx需要配置一些文件，但BrieBug 创建 一个项目，让你通过cli 来生成这些文件——ngrx-entity-schematic。它自动创建actions,reducers,帮你命名一切。你只用定义model,然后关联到后台服务即可！
