如何使路径等到特征模块以角度加载

时间:2018-06-14 11:04:52

标签: angular

我有一个角度应用程序,有不同的延迟加载模块。 app.html的结构是

<mat-toolbar></mat-toolbar>
<router-outlet></router-outlet>
<app-footer></app-footer>
在页面路由开始时,页脚会在工具栏下方的顶部停留一段时间,直到延迟加载的模块完成加载。 这也在SEO中影响它。例如在Google PageSpeed Insights(enter image description here)上, 页面是空的。我不认为我需要使用角度路由解析器,因为这里的重点是等待模块加载 不要等待数据到达。我可以在enter image description here查看我的webapp。我怎样才能让路由等到模块加载完毕。

1 个答案:

答案 0 :(得分:0)

将下面的代码放在index.html中解决了Google网页速度洞察的空白页问题:

<script>
if (window.document.documentMode) {
  // polyfill IE11 in a blocking way
  var s = document.createElement('script');
  s.src = 'generated/ie-polyfills.min.js';
  document.head.appendChild(s);
} else if (!Object.assign) {
  // polyfill other non-evergreen browsers in a blocking way
  var polyfillUrl = "https://cdn.polyfill.io/v2/polyfill.min.js?features=default,Array.prototype.find&flags=gated&unknown=polyfill";
  // send a blocking XHR to fetch the polyfill
  // then append it to the document so that its eval-ed synchronously
  // this is required because the method used for IE is not reliable with other non-evergreen browsers
  var xhr = new XMLHttpRequest();
  xhr.addEventListener("load", function() {
    var s = document.createElement('script');
    s.type = 'text/javascript';
    var code = this.responseText;
    s.appendChild(document.createTextNode(code));
    document.head.appendChild(s);
  });
  xhr.open("GET", polyfillUrl, false);
  xhr.send();
}

根据{{​​3}}回答。