Angular 2中懒惰引用的路由在哪里? [英] Where is the lazy quoted route in Angular 2?

查看:77
本文介绍了Angular 2中懒惰引用的路由在哪里?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我看过此说明性主题演讲,其中 Papa Misko 介绍了RC版本中引入的新路由系统.

I've watched this clarifying keynote in which Papa Misko presents the new routing system introduced in the RC version.

该演示文稿中包含了最后一次延迟加载拼图" 的解决方案,该解决方案依赖于引用路径组件名称的方式,如他自己的示例所示:

It's contained in the presentation the solution for the "Last Lazy Loading Puzzle Piece", and that relies on quoting the route component name as shown in his own example:

{path: 'simple', component: SimpleCmp}   // Non-lazy route
{path: 'simple', component: 'SimpleCmp'} // Lazy route

但是它对我不起作用!打字稿编译器在抱怨. 这是错误:

But its not working to me! The typescript compiler is complaining though. Here is the error:

Argument of type '{ path: string; component: string; }[]' is not assignable to parameter of type 'RouteMetadata[]'.
  Type '{ path: string; component: string; }' is not assignable to type 'RouteMetadata'.
    Types of property 'component' are incompatible.
      Type 'string' is not assignable to type 'Type'.

似乎尚未实施. 有人知道发生了什么,是否真的没有实现?

It seems that is was not implemented yet. Does someone know what's going on and if it's really not implemented?

推荐答案

目前(16/08/16)尚未完成,但是如果您使用的是 webpack ,则可以结合使用es6-promise和webpack的require()来创建自己的延迟加载".

At this time (06/08/16) it isn't finished yet, but if you're using webpack you can use a combination of es6-promise combined with webpack's require() to create your own "lazy-loading".

当正式的延迟加载程序发布时,您可以轻松地删除它并使用即将发布的标准Angular延迟加载程序.

When the official lazy-loading comes out, you can just as easily remove this and use the upcoming standard Angular lazy-loader.

angular2 webpack入门.

@RouteConfig([
  // Async load a component using Webpack's require 
  // with es6-promise-loader and webpack `require`

  { 
    path: '/about', name: 'About', 
    loader: () => require('es6-promise!./about')('About') 
  }

])

只需确保在package.json中安装了es6-promise.

Just make sure you have es6-promise installed and inside your package.json.

npm i es6-promise --save

这篇关于Angular 2中懒惰引用的路由在哪里?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆