Загрузка Javascript и отображение данных из запроса http - PullRequest
0 голосов
/ 10 октября 2018

В моем приложении у меня есть сервер с интерфейсом отдыха, который обрабатывает все записи базы данных.Когда пользователь входит в приложение, все пользовательские данные должны быть загружены и отображены из моделей базы данных в пригодные для использования модели.Разница заключается в том, что модели базы данных содержат только идентификаторы своих дочерних объектов, в то время как у нормальной модели непосредственно наследуются дочерние объекты.Таким образом, чтобы загрузить все объекты с помощью http-запроса из базы данных и отобразить их, я строю это:

class SomeClass {
  private loadProjectData(projectId: string): void {
    let s: Sheet;
    let d: Dashboard;
    this.databaseService.getDocument("Projects", projectId).subscribe(
      (project: ProjectDB) => {
        this.project = new Project(project.id, project.name, project.theme, []);
        for (const dash of project.dashboards) {
          this.databaseService
            .getDocument("Dashboards", dash)
            .subscribe((dashboard: DashboardDB) => {
              d = new Dashboard(dashboard.id, dashboard.name, []);
              for (const shee of dashboard.sheets) {
                this.databaseService
                  .getDocument("Sheets", shee)
                  .subscribe((sheet: SheetDB) => {
                    s = new Sheet(sheet.id, sheet.name, []);
                    for (const wid of sheet.widgets) {
                      this.databaseService
                        .getDocument("Widgets", wid)
                        .subscribe((widget: WidgetDB) => {
                          // TODO check widget type
                          s.widgets.push(
                            new Widget(
                              widget.id,
                              widget.name,
                              widget.position,
                              widget.isDeveloped,
                              widget.type,
                            ),
                          );
                          this.dataService.changeProjectData(this.project);
                        });
                    }
                  });
              }
              d.sheets.push(s);
              this.dataService.changeProjectData(this.project);
            });
          this.project.dashboards.push(d);
          this.dataService.changeProjectData(this.project);
        }
        console.log("Project", this.project);
        this.router.navigate(["dashboard"]);
      },
      err => {
        console.log("Error loading project data from database ", err);
      },
    );
  }
}

Код перебирает все иерархии: Project -> Dashboards -> Sheets -> Widgetes.Идея состоит в том, что при загрузке каждого нижнего иерархического элемента он получает толчок к верхнему материнскому элементу.Но при выполнении кода все объекты, кроме проекта, не определены.Кто-нибудь знает, как это решить?Заранее спасибо.

1 Ответ

0 голосов
/ 10 октября 2018

Вы должны посмотреть на уровни подписки, данные, которые вы хотите увеличить, существуют только в обратном вызове подписки, но вы хотите использовать его извне.А также взгляните на некоторые методы rxjs, такие как комбинация switchlatest и т. Д., Чтобы разбить этот код на что-то, что будет удобно для других разработчиков.

...