当我的全局共享服务中的任何内容更新时,为什么我的组件对象不会自行更新? Angular

Why isn't my component object getting updated itself when anything in my globally shared service updates? Angular

我有这项服务:

    export class RecipeService{
    
        selectedRecipe: Recipe = 'xyz';
    }

我有这个组件使用这个服务:

    export class RecipesComponent implements OnInit {
    
      selectedRecipe: Recipe;
    
      constructor(private recipeService: RecipeService) { }
    
      ngOnInit(): void {
        this.selectedRecipe = this.recipeService.selectedRecipe;
      }
    
    }

服务在app.module.ts中定义用于注入,这意味着所有组件都获得相同的实例。

我的问题是,每当我更新其中一个组件中的 selectedRecipe 变量时,它不会在其他组件中更新回来,尽管它被引用了,因此我希望立即进行更改。

我做错了什么?

它没有得到更新,因为新值没有“发送”到已经启动的 angular 组件。

相反,你应该使用 observables。

例如:

/* service */
private recipe = "xyz";
public recipeSubject: BehaviorSubject<string> = new BehaviorSubject(this.recipe);

// when changing the recipe
recipeSubject.next(this.recipe);

/* component */
this.service.recipeSubject.subscribe(res => this.recipe = res);

我在谷歌上搜索了一下,发现其中一篇帖子是因为我的反对。我服务中的对象 (Recipe) 包含原始类型,即 string。如果您的对象包含原始类型,它不会作为引用传递,因此服务对象的更改不会反映在组件中,因为它们现在不同了。

虽然我必须清楚,在数组的情况下,即使我的数组包含具有原始类型的对象,它也能很好地工作。更改仍然反映出来。