Angular 6 Observable and subscribe

Muhammad Ali

I have some data in angular services coming from REST API

info.services.ts

getCustomerDetails() {
   this.http.get(this.localUrl + this.customerUrl + this.options).pipe(map((response: Response) => response.json()))
}

my homepage.ts

getData(){
  this.infoServices.getCustomerDetails().subscribe(data=>{
    if(data) {
      this.name = data[0].customerInfo.name;
    }
  })
}

and my home.html

<input type="text" value="{{this.name}}" formControlName="name" />

my question is there any better way to fetch data instead of doing data[0]?

endpoint:

router.post("/request/customer", (req, res) => {
    var pendingRequest = new Customer({
        name: req.body.name,
        age: req.body.age,
        isNewCustomer: true,
        requestInfo: {
            customerType: req.body.customerType,
            sendTo: {
                email: req.body.sendTo_email,
                company: req.body.sendTo_company
            },
            returnTo: {
                email: req.body.returnTo_email,
                company: req.body.returnTo_company
            }
        },
    });
    pendingRequest
        .save()
        .then(result => {
            console.log(result);
            res.status(200).json({
                message: "Handling POST request to /pending",
                createdRequest: result
            });
        })
        .catch(err => {
            console.log(err);
            res.status(500).json({
                error: err
            });
        });
Muhammad Ali

I have found the solution, so in ts file:

customerData:any = []
    getData(){
    this.customerData = [];
      this.infoServices.getCustomerDetails().subscribe(data=>{
        if(data) {
          this.customerData = data;
        }
      })
    }

and in your html template simply

<div *ngFor="let data of customerData; let i = index">
{{data.name}}
</div>

Collected from the Internet

Please contact [email protected] to delete if infringement.

edited at
0

Comments

0 comments
Login to comment

Related

Angular 6 call subscribe() for Observable multiple times

Subscribe multiple observables within an observable response array angular 6

unable to subscribe the observable in angular

Return Observable and subscribe in angular

How to subscribe to an Observable in Angular

Using Observable and Subscribe in Angular with Firebase

subscribe keys of and observable in Angular/RxJS

Angular 8 subscribe to an observable in an interceptor

Angular 2 Observable subscribe not working

Subscribe to an observable within a loop in Angular

Angular 5 subscribe and unsubscribe Observable

Subscribe Angular 6

rxjs6 ActivatedRoute subscribe to observable

Angular 6 Subject Subscribe is not working

Angular 6 subscribe changes 'this' context

Re-subscribe to an observable with rx-angular

Angular 2+ subscribe to observable on change only

How to test subscribe section of an observable in angular

Why Subscribe is working without Observable in Angular

Angular cannot subscribe to firebase list observable

Using Angular Async Pipe to Subscribe to Observable

Angular: How to use result of `.subscribe()` in consequent Observable

Angular subscribe to observable then return a new one

How to perform lookup in Angular using Subscribe Observable

Angular 2 subscribe to an attribute of an observable array

angular 2 rxjs subscribe to observable code not executing

Observable in angular failed to subscribe on constructor or ngOnInit()

How to subscribe from Angular to a NestJs Observable?

Using Angular Observable to subscribe to Session Storage key