我想根据从我的休息服务器获得的餐厅的名称值来填充一个数组。我将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") {
}
});