title: Why use .takeUntil() over .take(1) with Http service?
body: <p><strong>Context:</strong> I am working on implementing <a href="https://github.com/ngrx/effects" rel="noreferrer">@ngrx/effects</a> within an <a href="https://github.com/ngrx/store" rel="noreferrer">@ngrx/store</a> project and studying the <a href="https://github.com/ngrx/example-app" rel="noreferrer">example app</a>.</p>
  
  <p><strong>Question:</strong> In the <a href="https://github.com/ngrx/example-app/blob/master/src/app/effects/book.ts#L50" rel="noreferrer">BookEffects class file</a>, line #50, why is <code>takeUntil(...)</code> used instead of <code>take(1)</code>?  Both would seem to accomplish the same thing in this case.</p>
  
  <pre class="lang-ts prettyprint-override"><code>@Injectable()
  export class BookEffects {
    constructor(private actions$: Actions, private googleBooks: GoogleBooksService) { }
  
    @Effect()
    search$: Observable&lt;Action&gt; = this.actions$
      .ofType(book.ActionTypes.SEARCH)
      .debounceTime(300)
      .map((action: book.SearchAction) =&gt; action.payload)
      .switchMap(query =&gt; {
        if (query === '') {
          return empty();
        }
  
        const nextSearch$ = this.actions$.ofType(book.ActionTypes.SEARCH).skip(1);
  
        return this.googleBooks.searchBooks(query)
          .takeUntil(nextSearch$)
          .map(books =&gt; new book.SearchCompleteAction(books))
          .catch(() =&gt; of(new book.SearchCompleteAction([])));
      });
  }
  </code></pre>
  
  <p>And here is the <a href="https://github.com/ngrx/example-app/blob/master/src/app/services/google-books.ts#L8-L23" rel="noreferrer">Google Books service file</a>:</p>
  
  <pre class="lang-ts prettyprint-override"><code>@Injectable()
  export class GoogleBooksService {
    private API_PATH: string = 'https://www.googleapis.com/books/v1/volumes';
  
    constructor(private http: Http) {}
  
    searchBooks(queryTitle: string): Observable&lt;Book[]&gt; {
      return this.http.get(`${this.API_PATH}?q=${queryTitle}`)
        .map(res =&gt; res.json().items || []);
    }
  
    retrieveBook(volumeId: string): Observable&lt;Book&gt; {
      return this.http.get(`${this.API_PATH}/${volumeId}`)
        .map(res =&gt; res.json());
    }
  }
  </code></pre>