title: Compare Observable's Previous Value With Next Value in Angular
body: <p>I have been working on an App that allows a few different components to update a <code>BehaviorSubject</code> in Angular. Within each component I store a local copy of the previous <code>BehaviorSubject</code> value. In order to know whether or not the component generated the new value being pushed out I was planning on just comparing the two objects using LoDash's <code>_.isEqual()</code> function. However I am finding that my local copy of the Observable has already been updated before the comparison can take place.</p>
  
  <p>Does Angular look for <code>=</code> statements and create an external binding to that component property outside of the Observable <code>next</code> function?</p>
  
  <p>Given the code below I am finding that my <code>this.QueryParams</code> property within the component has been updated to the current value being processed in the function, causing my comparison to fail even though I don't assign the new value to the property until the <code>if</code> statement has been evaluated.</p>
  
  <p><strong>Component</strong></p>
  
  <pre class="lang-js prettyprint-override"><code>export class LogsModalComponent implements OnInit {
  
      private QueryParams: LogsQueryParameters
  
      ngOnInit() {
  
          this._LogsService.QueryParameters$.subscribe(_QueryParams =&gt; {
              console.log(this.QueryParams);
              console.log(_QueryParams);
  
              if (!_.isEqual(this.QueryParams, _QueryParams) {
                  this.QueryParams = _QueryParams;
  
                  // Some code to process if the new value was different.
              }
          }
      }
  
      updateStartDate() {
          this.QueryParams.filterStartDate = _.isUndefined(this.FilterStartDate) ? NaN : new Date(this.FilterStartDate.nativeElement.value).getTime();
          this._LogsService.updateQueryParams(this.QueryParams);
  }
  }
  </code></pre>
  
  <p><strong>Service</strong></p>
  
  <pre class="lang-js prettyprint-override"><code>    LogsQueryParameters: BehaviorSubject&lt;LogsQueryParameters&gt; = new BehaviorSubject&lt;LogsQueryParameters&gt;({
              limit: 25,
              logLevels: "",
              logTypes: "",
              logUserIDs: "",
              filterStartDate: NaN,
              filterEndDate: NaN
          })
          LogsQueryParameters$ = this.LogsQueryParameters.asObservable();
  
      updateQueryParams(QueryParams) {
          this.LogsQueryParameters.next(QueryParams);
      }
  </code></pre>