类型 'void' 不能分配给类型 'Recipe[]'。这行代码中的错误 this: recipes = this.recipeService.getRecipes();

Posted 2023-02-22

【中文标题】类型 \'void\' 不能分配给类型 \'Recipe[]\'。这行代码中的错误 this: recipes = this.recipeService.getRecipes();

【英文标题】：Type 'void' is not assignable to type 'Recipe[]'. error in this line of code this: recipes = this.recipeService.getRecipes();类型 'void' 不能分配给类型 'Recipe[]'。这行代码中的错误 this: recipes = this.recipeService.getRecipes();

【发布时间】：2019-08-05 00:00:51

【问题描述】：

组件代码：

import  Component, OnInit  from '@angular/core';
import  RecipeService  from '../recipe.service';
import  Recipe  from '../recipe.model';

@Component(
    selector: 'app-recipe-list',
    templateUrl: './recipe-list.component.html'
)

export class RecipeListComponent implements OnInit 
    recipes: Recipe[];
    constructor(private recipeService: RecipeService) 
    

    ngOnInit() 
        this.recipes = this.recipeService.getRecipes();
    

服务：

import  Recipe  from './recipe.model';
import  EventEmitter  from '@angular/core';
export class RecipeService  
    recipeSelect = new EventEmitter();

    private recipes: Recipe[] = [
        new Recipe('A Test Recipe', 'This is simply a test', 'https://upload.wikimedia.org/wikipedia/commons/1/15/Recipe_logo.jpeg'),
        new Recipe('Another Test Recipe', 'This is simply a test', 'https://upload.wikimedia.org/wikipedia/commons/1/15/Recipe_logo.jpeg')];
    getRecipes() 
        this.recipes.slice();
    

【问题讨论】：

你应该从 getRecipes() 方法返回 this.recipes.slice()：return this.recipes.slice();

您忘记在您的getRecipes 方法中添加return 语句，因此它目前没有返回任何内容，因此出现错误。

谢谢。是的，我忘了添加返回类型

【参考方案1】：

您需要从getRecipes 函数返回食谱

getRecipes(): Recipe[] 
    return this.recipes.slice();

【参考方案2】：

getRecipes(): Recipe[] 
    return [...this.recipes];

在您的示例中，您的服务函数在您期待一个集合返回（this.items）时不返回任何内容。

所以你必须使用关键字return来实现。

此外，您正在使用slice 返回本地集合的副本，这是一个好主意，但为了可读性和潜在性能，我更喜欢spread operator。

有关性能原因，请参阅此讨论：discussion

【参考方案3】：

Your Code
getRecipes() 
         this.recipes.slice();
     

正确的代码 获取食谱（）

         return this.recipes.slice();