Обработка связанных моделей в Angular - PullRequest
Новая
       34

Обработка связанных моделей в Angular

0 голосов
/ 30 мая 2019

Я новичок в Angular и пытаюсь найти правильный способ работы со связанными моделями. Наш API возвращает каждую модель с идентификаторами любой другой модели, с которой он связан.

Ответы API 

// api/contracts
{
  contracts: [{
    id: 1
    client_id: 1
    salesman_id: 1
  }, {
    id: 1
    client_id: 1
    salesman_id: 1
  }]
}

// api/clients
{
  clients: [{
    id: 1,
    name: 'Company 1'
  }]
}

// api/salesmen
{
  salesmen: [{
    id: 1,
    name: 'John Smith'
  }]
}

Угловая модель Классы 

export class Contract {
  id: number;
  client_id: number;
  salesman_id: number;

  client: Client;
  salesman: Salesman;
}
export class Client {
  id: number;
  name: string;
}
export class Salesman {
  id: number;
  name: string;
}

Я могу получить исходные данные, используя угловой httpClient, но не могу найти способ получить соответствующие модели. Это работает, чтобы получить одну из связанных моделей, но я не вижу, чтобы это было правильным способом с любыми моделями, которые имеют более одной связанной модели.

Служба углового контракта 

export Class ContractService {
  getAll(): Observable<Contract[]> {
    return this.httpClient.get(API_URL + '/contracts').pipe(
      map(data => data.contracts as Contract[]),
      flatMap((contracts: Contract[]) => forkJoin(contracts.map((contract: Contract) => {
        return this.salesmanService.get(contract.salesman_id).pipe(
          map((salesman: Salesman) => {
            contract.salesman = salesman;
            return contract;
          })
        );
      })))
    );
}

Шаблон компонента 

<table>
  <thead>
    <tr>
      <th>ID</th>
      <th>Client</th>
      <th>Salesman</th>
    </tr>
  </thead>
  <tbody>
    <tr *ngFor='let contract of contracts$ | async'>
      <td>{{contract.id}}</td>
      <td>{{contract.client.name}}</td>
      <td>{{contract.salesman.name}}</td>
    </tr>
  </tbody>
</table>

Поэтому мне интересно, есть ли у кого-нибудь предложения о том, как работать с большими моделями при использовании наблюдаемых.

Наше предыдущее приложение использовало EmberJS, и наш API настроен для взаимодействия с Ember-Data. Так что, возможно, я застрял в Ember, но я надеюсь, что кто-то еще сталкивался с этим раньше.

...