title: Angular 5 consume json consisting of one object
body: <p>I am working on a barcode scanning app with angular.
  The number of the barcode returns a json containing a "box" object. How can i parse the box json to a box class in angular?</p>
  
  <p>This is my existing code:</p>
  
  <pre><code>//Injectable Dataservice
  export class BoxService {
  //url vars
  urlBegin:string = "url";
  urlEinde:string = "/last-order";
  url:string;
  test;
  constructor(@Inject(HttpClient) private http: HttpClient){
  }
  
  getBox(barcode):Observable&lt;Box&gt;{
      this.url = this.urlBegin + barcode + this.urlEinde;
      return this.http.get&lt;Box&gt;(this.url);
  }
  </code></pre>
  
  <p>}</p>
  
  <pre><code>// My component using the service showBox() is the method using the service
  import { Component, OnInit, Inject, Injectable } from '@angular/core';
  import { BoxService } from '../BoxService';
  import { Box } from '../Box';
  
  @Component({
  selector: 'app-Data',
  templateUrl: './Data.component.html',
  styleUrls: ['./Data.component.css']
  })
  
  export class DataComponent implements OnInit {
  uitkomst:String;
  box:Box;
  constructor(private boxService:BoxService) { }
  
  zoekBarcode(barcode):void{
  this.uitkomst = "ik heb info over deze barcode: " + barcode;
  this.showBox(barcode);
  }
  
  showBox(barcode){
  this.boxService.getBox(barcode).subscribe(data =&gt; this.box = data);
  
  console.log(this.box.boxNumber.toString());
  }
  ngOnInit() {
  
  }
  }
  
  // Box Class
  import { Contentline } from "./Contentline";
  
  export class Box {
  boxNumber: number;
  status: number;
  shipTo: string;
  shipToName: string;
  contentLines: Contentline[];
  }
  
  //Contentline class
  export class Contentline {
  articleIdCustomer: string;
  description: string;
  orderId: string;
  orderLineId: string;
  quantity: number;
  uom: string;
  closet: any;
  shelf: any;
  deliveryDate: string;
  }
  </code></pre>
  
  <p>My JSON string looks like this:</p>
  
  <pre><code>{
      "boxNumber": 13100973,
      "contentLines": [
          {
              "articleIdCustomer": "112050",
              "description": " Nutraclear naaldvrije connector",
              "departmentName": null,
              "deliveryDate": "2018-06-26T22:00:00Z"
          },
          {
              "articleIdCustomer": "101512",
              "description": " LIJN INFUUSVERLENG 400CM 1,5 MM PE/PVC",
              "departmentName": null,
              "deliveryDate": "2018-06-27T22:00:00Z"
          },
          {
              "articleIdCustomer": "101053",
              "description": " LIJN INFUUS 700CM 1X2,1MM     25ST",
              "departmentName": null,
              "deliveryDate": "2018-06-27T22:00:00Z"
          },
          {
              "articleIdCustomer": "101053",
              "description": " LIJN INFUUS 700CM 1X2,1MM     25ST",
              "departmentName": null,
              "deliveryDate": "2018-07-03T22:00:00Z"
          },
          {
              "articleIdCustomer": "101053",
              "description": " LIJN INFUUS 700CM 1X2,1MM     25ST",
              "departmentName": null,
              "deliveryDate": "2018-07-04T22:00:00Z"
          },
          {
              "articleIdCustomer": "101386",
              "description": " DOP AFSLUIT ENTERALE SPUIT ENFIT (PER 8",
              "departmentName": null,
              "deliveryDate": "2018-06-25T22:00:00Z"
          }
      ],
      "status": 3,
      "otherDepartments": []
  }
  </code></pre>