Tiven Wang
Wang Tiven March 21, 2018
425 favorite favorites
bookmark bookmark
share share

Observables provide support for passing messages between publishers and subscribers in your application. Observables offer significant benefits over other techniques for event handling, asynchronous programming, and handling multiple values.[1.]

关于 RxJS 框架的介绍和应用可以参考另外几篇文章


我们来简单看一下 Observable 基本流程

Pattern: Observable => Subscriber => Subscription

const timer = new Observable((observer) => {
  let interval = setInterval(()=>
    observer.next(new Date(), 1000)
  return {
    unsubscribe() {
const timerSubscription = timer.subscribe({
  next(t) { console.log('Current time: ', t); },
  error(msg) { console.log('Error Getting Time: ', msg); }

// Stop listening for location after 10 seconds
setTimeout(() => { timerSubscription.unsubscribe(); }, 10000);

Observables in Angular

Angular 为他的很多常用异步操作都实现了 Observable , 这包括

  • EventEmitter class extends Observable
  • The HTTP module uses observables to handle AJAX requests and responses.
  • The Router and Forms modules use observables to listen for and respond to user-input events.


Similar Posts

  • Angular - Syncfusion Components How to use Syncfusion Components to create dashboard page in Angular Application?
  • Angular - Consume OData Services How to consume odata service in Angular Application?
  • TypeScript TypeScript Series: Language Handbook
  • TypeScript - Decorators Decorators provide a way to add both annotations and a meta-programming syntax for class declarations and members.
  • Angular - UI5 Web Components The UI5 Web Components share fundamental UI5 qualities with others to provide enterprise-grade features, Fiori UX and themeability. The goal is to achieve an easy consumption of UI5 controls to lower the entry barrier to use UI5 controls for own applications and to avoid complexity of UI5 rendering-stack by making the consumption of the full-stack UI5 optional. In general, the UI5 Web Components are targeting for Web Developers who want to have more flexibility to use just HTML tags or arbitrary JS frameworks.
  • What's Functional Programming 什么是函数式编程 (Functional Programming)


Back to Top