How to initialize object, array and object-array in angular service class?

Question

How to initialize an object inside an object and array-object in angular service class? I want to use the two-way binding into my-form, so I want to pass the variable from service class to Html template.

trainer.service.ts

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

import { Trainner } from '../trainner.model';
import { Observable } from 'rxjs';

const headerOption = {
 headers : new HttpHeaders({'Content-Type': 'application/json'})
};

@Injectable({
  providedIn: 'root'
})

  export class TrainnerService {
     selectedTrainer: Trainner;
      _url = 'http://localhost:3000/trainner';

  constructor( private _http: HttpClient ) { }

  register(registrationFormData) {
    return this._http.post<any>(this._url, registrationFormData);
  }

  getAllTrainner(): Observable<Trainner[]> {
    return this._http.get<Trainner[]>(this._url, headerOption);
  }

  putTrainner(trainer : Trainner): Observable<Trainner[]> {
    return this._http.put<Trainner[]>(this._url + `/$(emp._id)`, trainer);
  }
}

I have model.ts file

export class Trainner {
personal_details: { type: Object,
    name: { type: Object,
        first_name: String,
        last_name: String
    },
    dob: String,
    about_yourself: String,
    languages_known: { type: Array<Object>,
        items: {
            type: String
        }
    },
    willingly_to_travel: String
};

}

As you can see i have a model.ts file, so I need to initialize that particular modal so that i can use two-way binding when an update event occurs @LahiruChandima — GRV
– GRV, Commented Sep 16, 2019 at 9:17

Jazib · Accepted Answer · 2019-09-16 09:22:56Z

1

you can create multiple model classes. you can update the current model and create a TrainerName.ts class that holds the name object and Language.ts that holds the language object. like this:

export class TrainerName{
 first_name: String,
 last_name: String
}

and Language model class like :

export class Language {
items:  String       
}

and use it in your current model class like:

export class Trainner {
personal_details: { type: Object,
    name: TrainerName,
    dob: String,
    about_yourself: String,
    languages_known: Language[],
    willingly_to_travel: String
};

}

and in your service you can use map

getAllTrainner(): Observable<Trainner[]> {
    return this._http.get<Trainner[]>(this._url, headerOption).map(res => new Trainner(res));
  }

answered Sep 16, 2019 at 9:22

Jazib

1,37914 silver badges27 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Jazib Over a year ago

also you will need a constructor in your model class

GRV Over a year ago

drive.google.com/file/d/1TcytFU8FQJlH37u0MxpjHFhtFRghjphB/… please check the picture, em still getting error @Jazib

Jazib Over a year ago

@GRV yes you're getting an error because you're using object literal and TrainerName is a type not a value. so you can use a constructor as name: new TrainerName(firstName, lastName) sth like this

Collectives™ on Stack Overflow

How to initialize object, array and object-array in angular service class?

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related