如何根据来自JSON对象的HTTP GET的名称值填充数组?

时间:2019-06-05 13:50:16

标签: json angular typescript http glassfish

我想根据从我的休息服务器获得的餐厅的名称值来填充一个数组。我将angular作为前端,并将glassfish作为后端。我可以在控制台中打印出餐厅名称的名称,但是无法根据名称填写数据列表。我有五个带有数据的数组,根据名称,一个数组填充了数据列表。 我尝试使用if else语句,但是它不起作用

我将提供在控制台中看到的图片。


  <div class="card-header">
    <h3 class="mb-0">Menu</h3>
  </div>

  <div class="form-group">


    <label for="codes">Choose a menu:</label>
    <form
      (ngSubmit)="onOrganize(f)"
      #f="ngForm">
      <input type="text"  list="codes"  [(ngModel)]=codeValue [ngModelOptions]="{standalone: true}" (change)="saveMenu($event)">
      <datalist id="codes">
        <option *ngFor="let c of codeList" [value]="c.name" >{{c.name}}</option>
      </datalist>
    </form>



    <button type="submit" class="btn btn-primary btn-lg float-none" id="btnAanmaken" ng-click="onOrganize()" routerLink="/menu">Aanmaken</button>



  </div>


TS文件:

import {Component, OnInit, ViewChild} from '@angular/core';
import {HttpClient, HttpHeaders} from '@angular/common/http';
import {NgForm} from '@angular/forms';
import {empty, Observable} from 'rxjs';
import {any} from 'codelyzer/util/function';
import {map} from 'rxjs/operators';

@Component({
  selector: 'app-menu',
  templateUrl: './menu.component.html',
  styleUrls: ['./menu.component.css']
})
export class MenuComponent implements OnInit {

  public codeValue: string;

codeList = [ ];

  codeListMcd = [
    {id: 1, name: 'Hamburger menu', price: 3.50},
    {id: 2, name: 'Big mac menu', price: 5.50},
    {id: 3, name: 'Quarter Pounder menu', price: 5.50},
    {id: 4, name: 'Maestro burger menu', price: 6.50},
    {id: 5, name: 'Big Tasty menu', price: 6.50}
  ];

  codeListKfc = [
    {id: 1, name: 'Chicken burger menu', price: 3.50},
    {id: 2, name: 'Chicken bucket menu', price: 5.50},
    {id: 3, name: 'Spicy chicken menu', price: 5.50},
    {id: 4, name: 'Tender chicken menu', price: 6.50},
    {id: 5, name: 'Chicken nuggets menu', price: 6.50}
  ];

  codeListBk = [
    {id: 1, name: 'Whopper burger menu', price: 3.50},
    {id: 2, name: 'Texas Bacon king menu', price: 5.50},
    {id: 3, name: 'Double Steakhouse menu', price: 5.50},
    {id: 4, name: 'Chili Cheese burger menu', price: 6.50},
    {id: 5, name: 'Chicken Tendercrisp menu', price: 6.50}
  ];

  codeListDp = [
    {id: 1, name: 'Pizza Shoarma menu', price: 3.50},
    {id: 2, name: 'Pizza Roasted veggie menu', price: 5.50},
    {id: 3, name: 'Pizza Bbq mixed grill menu', price: 5.50},
    {id: 4, name: 'Pizza Hawaii menu', price: 6.50},
    {id: 5, name: 'Pizza Americana menu', price: 6.50}
  ];

  codeListNyp = [
    {id: 1, name: 'Pizza Double Tasty menu', price: 3.50},
    {id: 2, name: 'Pizza Mixed Grill menu', price: 5.50},
    {id: 3, name: 'Pizza Margherita menu', price: 5.50},
    {id: 4, name: 'Pizza BBQ Meatlovers', price: 6.50},
    {id: 5, name: 'Pizza Downtown Doner menu', price: 6.50}
  ];


  @ViewChild('f', {static: true}) form: NgForm;
  menu = {
    id: ' ',
    name: ' ',
    price: ' '
  };



  httpOptions = {
    headers: new HttpHeaders({
      'Content-Type': 'application/json',
      Authorization: 'my-auth-token'
    })
  };


  constructor(private http: HttpClient) {
  }

  ngOnInit() {
    this.http.get('http://localhost:8080/aquadine-jee/resources/restaurant')
      .subscribe(
        val => {
          const restStr = val;
          console.log(restStr);
          console.log(restStr[0].restaurantName);
          console.log(JSON.stringify(restStr[restStr.length - 1].restaurantName));



          JSON.stringify(restStr[restStr.length - 1].restaurantName);

          if ( JSON.stringify(restStr[restStr.length - 1].restaurantName) === 'Mcdonalds') {
                this.codeList = this.codeListMcd;
        } else if ( JSON.stringify(restStr[restStr.length - 1].restaurantName) === "Kentucky Fried Chicken") {
          }
        });

0 个答案:

没有答案