Angular 4 ElasticSearch example – Get All Documents in Index

In the post, we had known how to add Document to Index. This tutorial shows you way to get all Documents and show them.

Related Post:
Angular 4 ElasticSearch – Quick Start – How to add Elasticsearch.js
Angular 4 ElasticSearch example – How to create an Index
Angular 4 ElasticSearch example – Add Document to Index

More Practice:
Angular 4 ElasticSearch example – Documents Pagination with Scroll
Angular 4 ElasticSearch example – simple Full Text Search

Elasticsearch Tutorials:
Elasticsearch Overview
ElasticSearch Filter vs Query
ElasticSearch Full Text Queries – Basic

I. How to

1. Add ElasticSearch to Angular 4 Project

Please visit Angular 4 ElasticSearch – Quick Start – How to add Elasticsearch.js for details.

With the post, you will know how to:
– Install ElasticSearch
– Add ElasticSearch to Angular 4 Project
– Use it in the project

2. Create Index & Check Connection

Please visit Angular 4 ElasticSearch example – How to create an Index for details.

3. Get All Documents in Index
3.1 ElasticSearch Service

The response of search() function should be like:

3.2 Component to implement

With CustomerSource interface:

In HTML, we get Customer from CustomerSource._source:

II. Practice

0. Overview

Goal:
angular-4-elasticsearch-get-all-documents-overview

Project Structure:
angular-4-elasticsearch-get-all-documents-structure

1. App Module

2. ElasticSearch Service

3. Components
3.1 Add Document Component

Please visit: 3_Add_Document_Component (in the previous post) for details.

3.2 Details Component

customer-details.component.ts

customer-details.component.html

3.3 Show Documents Component

customer.interface.ts

show-customers.component.ts

show-customers.component.html

4. App Routing Module

5. App Component

app.component.ts

app.component.html

6. Check Result

Run Angular 4 App, go to http://localhost:4200/, add Customer Data, then choose Customers tab:
angular-4-elasticsearch-get-all-documents-overview

Open Browser Console, you can see:

III. Sourcecode

Angular4ElasticSearch-getDocuments

By JavaSampleApproach | October 15, 2017.

Related Posts


2 thoughts on “Angular 4 ElasticSearch example – Get All Documents in Index”

  1. Hi there, great set of articles, would be great to have the full source code in a repo somewhere so that you can browse in your own time and use as a comparison. Had a look on gitlab but the repo seems empty 🙁 Still great set of articles but if you find time can you pop a link to a repo sometime. Thanks

    1. Hi opentuned,

      Thank you for your suggestion. We have plan for repo and will implement it in the future.

      Best Regard,
      JSA.

Got Something To Say:

Your email address will not be published. Required fields are marked *

*