Javascript 页面内容仅在硬刷新后显示，不在重定向时显示

如何在没有硬刷新的情况下重定向到另一个路由

我第一次创建了一个ionic/angular应用程序。这是一个调查，在用户回答了一系列问题后，他们会被重定向到结果页面

我对结果页的重定向如下所示：

import { Router } from '@angular/router'
private router: Router
this.router.navigate(['/result/' + this.current_survey.id]);

我只是在努力刷新之后才看到结果，我不知道为什么

重定向发生的代码位于我的调查组件和重定向结果组件中。在ngOinit（）auf结果组件中，我从web数据库检索保存的数据，但此时数据不存在

测量组件中的代码块看起来：

if (this.current_survey.finished) {
        this.calculateResult().then((result) => {
          this.current_survey.result = result;
          this.storageService.update(this.current_survey, this.helperService.SURVEY_STORAGE).then(
            (value) => {
            this.storageService.removeKey(this.helperService.LAST_NOT_FINISHED_SURVEY);
            this.router.navigate(['result', this.current_survey.id]);
          });
        });
    }

// Check if survey is a new survey or should be load from previos surveys
    let survey_id;

    // Get id from route, if any id was given in url
    this.route.paramMap.subscribe((params: ParamMap) => {
      survey_id = params.get('id');
    });

    if (survey_id !== null) {
      survey_id = parseInt(survey_id, 10);
    }

    this.showResults(survey_id);

 const key = this.helperService.SURVEY_STORAGE + '_' + survey_id;
      // Preload all neccessary data
      this.storageService.getDataByName(key).then((data) => {
        if (data.length === 0) {
            this.alertService.show('Error', '', 'Result not found :(');
        } else {
          this.survey = data.shift();
        }
      });

“我的结果”组件中的ngOinit看起来：

if (this.current_survey.finished) {
        this.calculateResult().then((result) => {
          this.current_survey.result = result;
          this.storageService.update(this.current_survey, this.helperService.SURVEY_STORAGE).then(
            (value) => {
            this.storageService.removeKey(this.helperService.LAST_NOT_FINISHED_SURVEY);
            this.router.navigate(['result', this.current_survey.id]);
          });
        });
    }

// Check if survey is a new survey or should be load from previos surveys
    let survey_id;

    // Get id from route, if any id was given in url
    this.route.paramMap.subscribe((params: ParamMap) => {
      survey_id = params.get('id');
    });

    if (survey_id !== null) {
      survey_id = parseInt(survey_id, 10);
    }

    this.showResults(survey_id);

 const key = this.helperService.SURVEY_STORAGE + '_' + survey_id;
      // Preload all neccessary data
      this.storageService.getDataByName(key).then((data) => {
        if (data.length === 0) {
            this.alertService.show('Error', '', 'Result not found :(');
        } else {
          this.survey = data.shift();
        }
      });

在my result组件的ngOinit中调用的方法如下所示：

if (this.current_survey.finished) {
        this.calculateResult().then((result) => {
          this.current_survey.result = result;
          this.storageService.update(this.current_survey, this.helperService.SURVEY_STORAGE).then(
            (value) => {
            this.storageService.removeKey(this.helperService.LAST_NOT_FINISHED_SURVEY);
            this.router.navigate(['result', this.current_survey.id]);
          });
        });
    }

// Check if survey is a new survey or should be load from previos surveys
    let survey_id;

    // Get id from route, if any id was given in url
    this.route.paramMap.subscribe((params: ParamMap) => {
      survey_id = params.get('id');
    });

    if (survey_id !== null) {
      survey_id = parseInt(survey_id, 10);
    }

    this.showResults(survey_id);

 const key = this.helperService.SURVEY_STORAGE + '_' + survey_id;
      // Preload all neccessary data
      this.storageService.getDataByName(key).then((data) => {
        if (data.length === 0) {
            this.alertService.show('Error', '', 'Result not found :(');
        } else {
          this.survey = data.shift();
        }
      });

---

也许你可以提供更多的信息。调查结果存储在哪里？如果它们存储在数据库中，那么在结果页组件的ngOnInit（）方法中，您应该能够查询最新的结果。另一种选择可能是，当您导航到结果页面时，您在调查结果发布之前就已经这样做了。您可以执行以下操作，以确保在尝试检索值之前已保存该值：

save(surveyResults, surveyId) {
    this.someService.postResults(surveyResults)
    .subscribe(() => this.navigate(['result', surveyId]))
}

---

谢谢你的回答。我添加了一些代码块的附加信息和背景信息。我认为您是对的，如果结果组件试图访问，数据库目前还没有准备好。但是我把一切都放在一个承诺里，然后一步一步地执行，以避免这个问题。我想你的调查没有及时回来，以便得出结果。您可能想看看如何执行类似于

this.route.paramMap.pipe（switchMap（params=>this.showResults（params.get（'id'）））.subscribe（）的操作

因此，在调用showResults之前，您确定自己拥有route param。感谢您的提示。我也尝试了此操作，但未做任何更改。我不确定如何继续解决此问题。对我来说，一切看起来都很好，很有意义。在函数showResults中，我创建了一个console.log，它显示了正确的surveyId。可能storageService不是我的函数还没有准备好，但是我发现了Promise的这种问题，或者我对Promise和async的理解很差。