Angular sample code : GET form data

This example only showing how to post the data to Argos API with the following conditions.

  • By using Argos API, get the KYC/AML status data
  • We did not include email confirmation, (The email must belong to the owner of the email. You should include 2fa for this.)
  • KYC Level 1
  • Showing minimum requirement only.
  • You should handle the errors.
  • Used bootstrap 4.1.x for the form

HTML

Ok, lets make simple form. This form has 2 parameter input and a textbox for return data.

<div class="jumbotron">
  <div class="container">
      <div class="row">
          <div class="col-md-6 offset-md-3">
              <h3>Argos form demo 2</h3>
              <br><br>
              <form name="form" (ngSubmit)="onSubmit()" #f="ngForm" novalidate>
                  <div class="form-group">
                      <label for="email">Email</label>
                      <input type="text" class="form-control" name="email" [(ngModel)]="model.email" #email="ngModel" [ngClass]="{ 'is-invalid': f.submitted && email.invalid }" required email />
                      <div *ngIf="f.submitted && email.invalid" class="invalid-feedback">
                          <div *ngIf="email.errors.required">Email is required</div>
                          <div *ngIf="email.errors.email">Email must be a valid email address</div>
                      </div>
                  </div>

                  <div class="form-group">
                      <label for="id">ID</label>
                      <input type="text" class="form-control" name="id" [(ngModel)]="model.id" #id="ngModel" [ngClass]="{ 'is-invalid': f.submitted && id.invalid }" required />
                      <div *ngIf="f.submitted && id.invalid" class="invalid-feedback">
                          <div *ngIf="id.errors.required">id is required</div>
                      </div>
                  </div>
                 
                  <div class="form-group">
                      <button class="btn btn-primary">Submit</button>
                  </div>

                  <div class="form-group">
                    <label for="status">Status</label>
                    <input type="text" class="form-control" name="status" [(ngModel)]="model.status" #id="ngModel"  />
                </div>
              </form>
          </div>
      </div>
  </div>
</div>

TypeScript

Import http module to use http get.

import { HttpClient, HttpHeaders, HttpParams } from '@angular/common/http';

  constructor(private http: HttpClient) {

  }

When click submit button, get the data from API then display to the form.

onSubmit() {
    // get submission from argos

    const params = new HttpParams()
    .set('email', this.model.email)
    .set('id', this.model.id); 

    const header = new HttpHeaders()
    .set('x-api-key', 'YOUR_API_KEY');

    const httpOptions = {
      headers: header
      };

    this.http.get<getRes>('https://api.argos-solutions.io/v2/submissions/'+this.model.email+'/'+this.model.id, httpOptions)
      .subscribe(event => {
        // done
        console.log(event);
        // email: "test@argos-solutions.io",  id: "18olf81jn3w5mun"
        this.model.status = event.kyc_result.status;
      });

  }

Download sample

Sample code download