Каскадные вызовы для обновления состояния - PullRequest
0 голосов
/ 18 января 2020

Несколько вопросов относительно этого подхода: https://medium.com/@thomasburlesonIA / pu sh -basered-architectures-with-rx js -81b327d7c32d

  1. Есть ли вообще, хорошо известное название для такой архитектуры, которую я могу найти? (Нелегко найти)
  2. Я столкнулся с проблемой, когда у меня есть состояние, например
    interface AppState = {
     account: Account,
     servers: Server[]
    }

    interface Server {
     name: string;
     details: ServerDetails;
    }

    let state: AppState = {
      account: null,
      servers: null
    }

Мое намерение - загружать данные по требованию, когда пользователь меняет маршрутизатор, например, localhost / server / srvname Другими словами, детали извлекаются в компоненте ngOnInit деталей.

Но когда пользователь вводит url напрямую (localhost / server / srvname), он пропускает, скажем, предыдущие компоненты, которые обычно загружают данные Server и даже AppState. , У меня нет значения в AppState.servers, и я не могу обновить состояние.

Как правильно обрабатывать такую ​​загрузку. Должен ли я справиться с этим вручную, например,

getDetails(server: string) {
 this.loadServer(server); // load server before details
 this.loadDetauls(server);
 this.updateAppState();
}

Или поместить свойства в модель, выполняя вид onDemand из ORM?

Или для этого есть хороший шаблон или хорошо известный подход? Или ngrx обрабатывает такую ​​вещь?

1 Ответ

0 голосов
/ 18 января 2020

Вы можете использовать структуру маршрутизатора для создания родительских / дочерних компонентов, и таким образом разделить ответственность за то, за что должен отвечать каждый компонент.

Например, ваш компонент приложения всегда будет загружаться первым, чтобы он мог быть ответственным за загрузку начальных конфигураций, выполняя службы в цикле OnInit, после чего он загрузит компонент, определенный для маршрута, который вы связываете для загрузки.

, если вы предпочитаете разделяться на модули, вы можете создать серверный модуль со структурированным wouter для загрузки начальных сервисов в компоненте, а затем создания дочернего компонента для загрузки деталей

для модульного подхода к маршрутизатору будет выглядеть примерно так:

const routes: Routes = [
     {
        path: '',
        component: ServerComponent,
        children: [
          {
            path: 'details',
            loadChildren: () => import('./components/server-details/server-details.module').then(m => m.ServerDetailsModule)
          },
        ]
      },
    ];

    @NgModule({
      imports: [RouterModule.forChild(routes)],
      exports: [RouterModule]
    })
   export class ServerRoutingModule { }

...