Angular 2:BehaviorSubject / Subject在构造函数外部不起作用

时间:2017-05-26 15:20:16

标签: ionic2 angular2-services rxjs5 subject behaviorsubject

您好我需要将数据从一个组件传递到另一个组件,为此我使用的是BehavorSubject类(我也尝试使用Subject类,但对我来说不起作用)。这是我的代码: 主页有一个过滤器,当选择一个过滤器时,它调用服务,它的服务应该改变一个homePage的变量

HomePage.ts
@Component({
  providers: [PatientService],
})
export class HomePage {
   subscription: Subscription;
   constructor(  public auth: AuthService,
                public patientService: PatientService) {
      this.subscription = this.patientService.nameGiven.subscribe(
        nameGiven => {
          this.patientsByElement = nameGiven.toString();
      });
   ------ more code---
}

Filtro.ts
export class FiltroPage {
    showFilter(filter : FiltroT): void{
        ... code ...
        clearTimeout(this.timeout);
        this.timeout = setTimeout(() => {
            this.PatientService.getPatientsByTags(this.token,this.filterSelected);
        }  , 1000);
    }
}

patient-service.ts
import { Subject }    from 'rxjs/Subject';
import { Observable ,BehaviorSubject } from 'rxjs/Rx';
@Injectable()
export class PatientService {
    nameSource =  new BehaviorSubject("asd");
    nameGiven = this.nameSource.asObservable();
    this.nameSource.next('hi!!!');  //**it works but only in the constructor**
    this.nameGiven.subscribe(()=>{
       console.log("it changed");
    });

    getPatientsByTags(token: String, tags: Array<string>){
        return new Promise(resolve => {
            this.http.get(ConnectionParams.DevEnv + ProceduresNames.TagsByPatient + ProceduresNames.TagIdEtiqueta + tags, options)
            .map(res => res.json())
            .subscribe(data => {
              if(data.data.poAnicuRegistros){
                console.log("here")
                this.nameSource.next('hi TON :/');  // <-- ***here is the problem. It doesnt work***
              }
              else
                console.log("XX");
              resolve( this.data);
            });
        });
    }
}

1 个答案:

答案 0 :(得分:0)

最后我没有使用BehaviorSubject / Subject,我将数据从过滤器传递到主页:

HomePage.ts
public popoverCtrl: PopoverController
//code ...
showFilter(myEvent) {
    let popover = this.popoverCtrl.create(FiltroPage, {
      showConfirm: (x) => {
        //do something with the data received from the filter
      }
    });
    popover.present({
      ev: myEvent
    });

  }

Filter.ts
//code... 
params: NavParams;
showConfirm() {// function that return the data to homePage
        this.params.get('showConfirm')(this.patientsBytag);
    }