CODEWITHSUNDEEP
rxjsobservable
29er
29er

Reputation: 9034

Rxjs - Observable subscribe to watching one variable, completing on a change

i am trying to create an observable to watch a variable in my app, and as soon as the variable changes to null, all subscribers should be notified and completed. I was assuming the takeUntil property would work best but I seem to be doing something wrong.

export default class service {
    constructor($window) {
        'ngInject'
        this._currentObject = new BehaviorSubject(null)
    }

    open(config){
        this._currentObject.next(config)
        return this._currentObject.asObservable().takeUntil(null)
    }

    close(){
        this._currentObject.next(null)
    }
}

so for any methods that call the open function, i want to return them a new Observable that they can subscribe to, so they know when the object changed back to null. This would occur from somewhere else in the app that called the close method

service.open({
            prop:'test',
            prop2: 'right',
        }).subscribe(s => {
            // fires when currentObject is set back to null 
            //automatically completes
        })

When trying this, i get an error on takeUntil (You provided 'null' where a stream was expected. You can provide an Observable, Promise, Array, or Iterable. )

I'm not even sure this is a decent approach, but was wondering if someone could take a look and give me advice. Thanks!

Upvotes: 3

Views: 8526

Answers (1)

cartant
cartant

Reputation: 58430

takeUntil takes an observable as an argument - not a value - and takes until that observable emits a value.

takeWhile is more likely the operator you need, as it takes a predicate:

const source = new Rx.BehaviorSubject(null);
source
  .takeWhile((value, index) => (value !== null) || (index === 0))
  .subscribe(
    (value) => console.log(value),
    undefined,
    () => console.log("completed; changed back to null")
  );
  
source.next(1);
source.next(2);
source.next(3);
source.next(null);
.as-console-wrapper { max-height: 100% !important; top: 0; }
<script src="https://unpkg.com/rxjs@5/bundles/Rx.min.js"></script>

Upvotes: 5

Related Questions