Angular Application不从json服务器检索数据

Question

我正在尝试从本地服务器获取数据，但没有任何结果。这个想法是它由一个服务检索，该服务传回一个observable，并且需要数据的任何组件都订阅了observable。

dish.service.ts

import {Dish} from '../shared/dish';
import {DISHES } from '../shared/dishes';
import {Observable, of} from 'rxjs';
import { delay } from 'rxjs/operators';

import { map } from 'rxjs/operators';
import { HttpClient } from '@angular/common/http';
import { baseURL } from '../shared/baseurl';
import { Injectable } from '@angular/core';

@Injectable({
  providedIn: 'root'
})

export class DishService {

  constructor(private http: HttpClient) {

   }

  getDishes(): Observable<Dish[]>{
    console.log("Hey");
    return this.http.get<Dish[]>(baseURL + 'dishes');

  }
}

menu.component.ts

import { Component, OnInit, Inject } from '@angular/core';
import { Dish } from '../shared/dish';
import {DishService} from '../services/dish.service';

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

    dishes: Dish[];

  constructor(private dishService: DishService, @Inject('BaseURL') private BaseURL) { }

  ngOnInit() {
    (dishService => dishService.getDishes().subscribe(dishes => this.dishes = dishes))
  }
 }

它将数据传递给menu.component.html，在添加服务器之前工作正常，所以我知道不是这样。这是有趣的：第一个代码示例中的console.log（“Hey”）不会执行。这就像是MenuSeriv甚至没有调用dishSerivce.getDishes（）方法。我不知道如何深入挖掘。有没有人有任何其他想法？

Answer 1

它应该如下，

ngOnInit() {
     dishService.getDishes().subscribe(dishes => this.dishes = dishes))
  }

Answer 2

问题是符合的

(dishService => dishService.getDishes().subscribe(dishes => this.dishes = dishes))

基本上你在这里声明一个函数，而不是调用它。你的代码相当于

ngOnInit(){
    function(dishService){
         return dishService.getDishes().subscribe(dishes => this.dishes = dishes);
    }
}

考虑以下代码实际调用函数，将this.dishService作为参数传递。

    (dishService => dishService.getDishes().subscribe(dishes => this.dishes = dishes))(this.dishService)

话虽如此，正确的方法是

ngOnInit() {
   this.dishService.getDishes()
      .subscribe(dishes => this.dishes = dishes);
}