javascript - 在角度 ngrx 存储中加载数据时出现问题

Question

我正在尝试使用 Drupal 做一个无头网站，但是当我尝试在两个组件（产品和服务）中导入数据时，只有这两个组件中的一个使用相同的选择器接收它！

我试图查看数据是否为空但已满。我将发布这两个组件的代码（仅第一次收费，例如，如果我将第一次反转 2）

import { Component, OnInit } from '@angular/core';
import { select, Store } from '@ngrx/store';
import { Subscription } from 'rxjs';
import { Servizio } from 'src/app/core/model/servizio';
import { selectHome} from 'src/app/redux/home';
import { deserialize } from "deserialize-json-api";


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

  subscription=new Subscription();
  
  servizi;

  constructor(private store: Store) { }

  ngOnInit(): void {
    
    this.subscription.add(this.store.pipe(select(selectHome)
    ).subscribe(servizi => {
      this.servizi=deserialize(servizi);
      
        this.getS(this.servizi)  
    }));
  
  }
  getImage(value){
    return "http://test.localhost:8080"+value;
  }
  getS(lel){
    console.log(lel)
  }

}

第二部分：

import { Component, OnInit } from '@angular/core';
import { select, Store } from '@ngrx/store';
import { Subscription } from 'rxjs';
import { Prodotto } from 'src/app/core/model/prodotto';
import { selectHome } from 'src/app/redux/home';
import { deserialize } from "deserialize-json-api";

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

  subscription=new Subscription();
  
  prodotti;

  constructor(private store: Store) { }

  ngOnInit(): void {
    this.subscription.add(this.store.pipe(select(selectHome)
    ).subscribe(prodotti => {
      this.prodotti=deserialize(prodotti);
    }));
  }

  getImage(value){
    return "http://test.localhost:8080"+value;
  }
}

最后是 html ：

<div class="container">
<div class="sizer">
<!-- Grid row -->
<div class="row">

    <!-- Grid column -->
    <p>{{servizi.data.field_servizi}}</p>
    <div class="column mb-4 px-2" *ngFor="let servizio of servizi.data.field_servizi | async">
        <p>yes</p>
    <!--Card Primary-->
    <div class="categorieP2">
    <img [src]="getImage(servizio.field_immagine.uri.url)">
    <div class="t">
        <h1>{{servizio.field_titolo}}</h1>
        <p>{{servizio.field_descrizione}}</p>
    </div>

    </div>  
    <!--/.Card Primary-->

    </div>
</div>
<!-- Grid row -->
</div>
</div>

标签： javascriptangulardatabasengrx