有没有办法在角度2预先加载路线，以防止白色闪烁和跳到顶部？

Question

使用角质/角质种子，我定义了一组路由。但是，我遇到的问题是，每个路由都被延迟加载，导致一个白色的闪烁和延迟(并且每次第一次加载路由时跳到页面的顶部).我们在加载html文件时要避免的那种旧风格的东西。

以下是我的路由配置：

@RouteConfig([
  {path: '/about', component: About, name: 'About', useAsDefault: true},
  {path: '/features', component: Features, name: 'Features'},
  {path: '/examples', component: Examples, name: 'Examples'},
  {path: '/download', component: Download, name: 'Download'},
  {path: '/contact', component: Contact, name: 'Contact'}
])

有办法预装这些路线吗？

Answer 1

正如@A_Singh在一条评论中指出的那样，问题是文件是分开加载的，因为它们不是由webpack打包的，所以在需要模板之前不能将它们作为.js包包括进来，从而导致异步延迟(虽然我仍然无法解释跳转到页面顶部的原因)。

下面是如何修改角质/角质种子项目的webpack配置：

package.json

"devDependencies": {
  ...,
  "html-loader": "^0.4.3",
},

webpack.config.js

module: {
  loaders: [
    ...,
    { test: /\.html$/, loader: 'html' }
  ]
}

组件中的示例用法

@Component({
  template: require('app/components/your-component/your-component.html')
})

现在，路线立即装载，没有闪烁或跳跃进行。

Answer 2

您的页面在过渡期间有动画吗？可能是风格..。张贴一些代码，以便我们可以为您检查。你试过纳克斗篷指令吗？它确实解决了您所描述的问题：https://docs.angularjs.org/api/ng/directive/ngCloak