angular 定义对象_Angular 中的可观察对象

Angular 使用可观察对象作为处理各种常用异步操作的接口。比如：

• EventEmitter 类派生自 Observable。
• HTTP 模块使用可观察对象来处理 AJAX 请求和响应。
• 路由器和表单模块使用可观察对象来监听对用户输入事件的响应。

EventEmitter

Angular 提供了一个 EventEmitter 类，它用来通过组件的 @Output() 装饰器 发送一些值。EventEmitter 扩展了 RxJS Subject，并添加了一个 emit() 方法，这样它就可以发送任意值了。当你调用 emit() 时，就会把所发送的值传给订阅上来的观察者的 next() 方法。 我们来查看一下该类的定义：

export declare class EventEmitter<T extends any> extends Subject<T> {
    /**
     * Creates an instance of this class that can
     * deliver events synchronously or asynchronously.
     *
     * @param isAsync When true, deliver events asynchronously.
     *
     */
    constructor(isAsync?: boolean);
    /**
     * 发出包含给定值的事件。
     */
    emit(value?: T): void;
    /**
     *注册此实例发出的事件的处理程序。
     */
    subscribe(generatorOrNext?: any, error?: any, complete?: any): Subscription;
}

EventEmitter 与指令@Output 一起在组件中使用以同步或异步方式发送自定义事件，并通过订阅实例来注册这些事件的处理程序。

接下来我们演示一个案例，在组件之间传递数据。

子组件 zippy.component.ts

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


@Component({
  selector: 'app-zippy',
  templateUrl: '
    <div class="zippy">
      <div (click)="toggle()">点击该文本</div>
      <div [hidden]="visible">
        <ng-content></ng-content>
      </div>
    </div>
  '
})
export class ZippyComponent implements OnInit {
  visible = true;
  //