In Angular 2 error when using Publish and Connect to create Hot observable

I am trying to create Hot observable (RxJS API) in angular 2
similar to working example in http://jsbin.com/fewotud/3/edit?js,console

So when I use “Publish” the debugger keep telling me the Publish function is undefined
so my question how can I use Publish in Angular 2 ? Am I missed to add any library ?
here is my code :

//our root app component
import {Component} from 'angular2/core';
import {Observable} from 'rxjs/Observable';

@Component({
  selector: 'my-app',
  providers: [],
  template: `
    <div>
      <h2>Hello {{name}}</h2> 
      <table><tr *ngFor="#itm of values"><td>{{itm}}</td></tr></table>
    </div>
  `,
  directives: []
})
export class App {
  tasks:Observable<Array<number>>;
  constructor() {
    this.values=[];

    let tasks=new Observable(observer =>
    {
      observer.next(1);
      observer.next(2);
      observer.next(3);

    } ).publish();
    tasks.connect()

    let subscription= this.tasks.subscribe(
      value => this.values.push(value+5),error => this.error='error !',
      () => this.finished = 'completed !'
      ); 
    ) 
    this.name = 'Angular2';




  }

}

here is my full version in plnkr :
https://plnkr.co/edit/DFT8AWmAiKAO2CvjrUWn?p=preview

1
Leave a Reply

avatar
1 Comment threads
0 Thread replies
0 Followers
 
Most reacted comment
Hottest comment thread
1 Comment authors
Jason Recent comment authors
  Subscribe  
newest oldest most voted
Notify of
Jason
Guest

You need to include it using something like that:

import {Observable} from 'rxjs/Rx';

or

import 'rxjs/add/operator/publish';

I also see some typos in your code:

let subscription= tasks.subscribe( // <-------
  value => this.values.push(value+5),error => this.error='error !',
  () => this.finished = 'completed !'
  ); 
)

And you need to call the connect method after subscribing…

See this plunkr: https://plnkr.co/edit/ESA5RZ4Ce7jz485CIcIy?p=preview.