Трудность доступа к фиктивным данным JSON в другой угловой файл

Question

Я пытаюсь получить доступ к фиктивным данным JSON из файла empirical-percentiles.mock.ts в файл empirical -centtiles.stories.ts.Я попытался написать некоторый код в функции getEmpiricalPercentilesData, которая находится в файле истории, но я не могу получить доступ к данным

Вот мой код для файла empirical-процентtiles.mock.ts

export class EmpiricalPercentiles {
  public static readonly empiricalPercentiles = {
    empiricalPercentiles: [
      {
        empiricalPercentile: 99,
        yearlyValueDailyDeviation: 40,
      },
      {
        empiricalPercentile: 95,
        yearlyValueDailyDeviation: 35,
      },
      {
        empiricalPercentile: 90,
        yearlyValueDailyDeviation: 30,
      },
      {
        empiricalPercentile: 75,
        yearlyValueDailyDeviation: 25,
      },
      {
        empiricalPercentile: 50,
        yearlyValueDailyDeviation: 20,
      },
      {
        empiricalPercentile: 25,
        yearlyValueDailyDeviation: 15,
      },
      {
        empiricalPercentile: 10,
        yearlyValueDailyDeviation: 10,
      },
      {
        empiricalPercentile: 5,
        yearlyValueDailyDeviation: 5,
      },
      {
        empiricalPercentile: 1,
        yearlyValueDailyDeviation: 1,
      },
    ],
  };
}

Вот мой код для файла emperical -centtiles.stories.ts

import { HTTP_INTERCEPTORS, HttpClient, HttpParams } from '@angular/common/http';
import { NgModule } from '@angular/core';
import { TranslateLoader, TranslateModule, TranslateParser, TranslateService } from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
import { select, text, withKnobs } from '@storybook/addon-knobs';
import { moduleMetadata, storiesOf } from '@storybook/angular';
import { Configuration, HoldingsControllerService, Snapshot } from '@trp/gdx-product-rest-client';
import { ConfigurationService, Locale, TranslateCustomParser } from '@trp/gdx-wc-core-services';
import { LocaleService } from '@trp/gdx-wc-core-services';
import { HoldingsModule } from '../../holdings.module';
import { EmpiricalPercentilesComponent } from './empirical-percentiles.component';
import { EmpiricalPercentiles } from './empirical-percentiles.mock';

import { HttpMockRequestInterceptorService } from '.storybook/HttpMockRequestInterceptor.service';

export function HttpLoaderFactory(httpClient: HttpClient) {
  return new TranslateHttpLoader(httpClient, './assets/i18n/', '.json');
}

let locale = Locale.EN_GLOBAL;
@NgModule()
export class EmpiricalPercentilesStoriesComponent {
  constructor(private translate: TranslateService, private localeService: LocaleService) {
    localeService.languageObservable().subscribe((language) => {
      translate.use(language);
    });
    localeService.locale = locale;
  }
}

storiesOf('Product/Product Details/Holdings/Portfolio Tracking', module)
  .addDecorator(withKnobs)
  .addDecorator(
    moduleMetadata({
      imports: [
        HoldingsModule,
        TranslateModule.forRoot({
          loader: {
            provide: TranslateLoader,
            useFactory: HttpLoaderFactory,
            deps: [HttpClient],
          },
          parser: {
            provide: TranslateParser,
            useClass: TranslateCustomParser,
          },
        }),
      ],
      schemas: [],
      providers: [
        ConfigurationService,
        HoldingsControllerService,
        {
          provide: HTTP_INTERCEPTORS,
          useClass: HttpMockRequestInterceptorService,
          multi: true,
        },
        {
          provide: Configuration,
          useFactory: ConfigurationService.getSwaggerRestConfig,
          deps: [ConfigurationService],
          multi: false,
        },
      ],
    }),
  )
  .add('Empirical Percentile Table', () => {
    const productCode = text('Product code', 'COMP245');
    const vehicle = text('Vehicle', Snapshot.VehicleTypeEnum.ETFFUND);
    locale = select('Locale', Locale, Locale.EN_GLOBAL as any);

    HttpMockRequestInterceptorService.setInterceptValues([
      {
        urlToIntercept: `NOT_DEFINED/v1/product/audience/institutional/country/us/language/en/product/${productCode}/empirical-percentiles-exhibit`,
        jsonReplacement: {},
        jsonFunction: productCode ? getEmpiricalPercentilesData : null,
      },
    ]);

    return {
      template: `
      <gdx-empirical-percentiles
        [productCode] = "productCode"
        [vehicle] = "vehicle">
      </gdx-empirical-percentiles>`,
      component: EmpiricalPercentilesComponent,
      props: {
        productCode,
        vehicle,
      },
    };
  });
export function getEmpiricalPercentilesData(params: HttpParams) {
  return {
    EmpiricalPercentiles,
  };
}

Как я могу получить данные из фиктивного файла в файл историй?

Answer 1

Что вы делаете, так это обращаетесь к классу целиком. Вместо этого вы можете написать в упомянутой вами функции, например,

export function getEmpiricalPercentilesData(params: HttpParams) {

  // Returning the *empiricalPercentiles* variable(Mock Data) of the class
  return EmpiricalPercentiles.empiricalPercentiles;
}