Angular 2：導入路由器包

我被困在爲什麼我無法獲取路由器作爲依賴項導入。在控制檯我得到的錯誤：Angular 2：導入路由器包

system.js:4 GET http://127.0.0.1:8000/angular2/src/platform/dom/dom_adapter.js 404 (Not Found)

看着他們用幾乎相同的設置谷歌的例子，所以我也不太清楚，我已經走了錯。如果我註釋掉路由器的導入，它將按預期工作。

的index.html：

<body> 
    <main>Loading...</main> 

    <script src="lib/traceur-runtime.js"></script> 
    <script src="lib/system.js"></script> 
    <script src="lib/Reflect.js"></script> 

    <script> 
     System.config({defaultJSExtensions: true}); 
    </script> 

    <script src="lib/angular2.js"></script> 
    <script src="lib/router.js"></script> 

    <script> 
     System.import('index').catch(console.log.bind(console)); 
    </script> 
</body>

index.js：

import {Component, View, bootstrap} from 'angular2/angular2'; 
import {routerInjectables} from 'angular2/router'; 
import {stepOne} from 'step-one/step-one'; 

@Component({ 
    selector: 'main' 
}) 

/*@RouteConfig([ 
    {path: '/', name: 'StepOne', component: stepOne, useAsDefault: true} 
])*/ 

@View({ 
    template: ` 
    <h1>INIT</h1> 
    <router-outlet></router-outlet> 
    ` 
}) 

class Main { 
    constructor(){} 
} 

bootstrap(Main, [routerInjectables]);

來源

2016-01-21 wiggle

你在哪裏導入'ROUTER_DIRECTIVES'？ –

seeems有在你的代碼少很多錯誤都是在這裏...

糾正你的進口與給定以下角度2現在處於測試階段...

import {bootstrap} from 'angular2/platform/browser'; 
import {Component, View} from 'angular2/core';

您還沒有提供路由器指令從這裏導入這個路由器指令並添加到指令列表中。

import {ROUTER_DIRECTIVES, RouteParams, ROUTER_PROVIDERS} from 'angular2/router';

更好的方法，你可以在index.ts

@Component({ 
     selector: 'main', 
     template: ` 
     <h1>INIT</h1> 
     <router-outlet></router-outlet>`, 
     directives: [ROUTER_DIRECTIVES], 
    }) 
@RouteConfig([ 
    {path: '/', component: stepOne, name: 'StepOne', useAsDefault: true} 
]) 

class Main { 
    constructor(){} 
} 

bootstrap(Main, [ROUTER_PROVIDERS]);

使用與您的index.html應該是這樣的。

<script src="node_modules/angular2/bundles/angular2-polyfills.js"></script> 
<script src="node_modules/es6-shim/es6-shim.min.js"></script> 
<script src="node_modules/systemjs/dist/system.src.js"></script> 
<script> 
    System.config({ 
       defaultJSExtensions: true, 
       map: { 
        rxjs: 'node_modules/rxjs' 
       }, 
       packages: { 
        rxjs: { 
        defaultExtension: 'js' 
       } 
       } 
      }); 

</script> 
<script src="node_modules/angular2/bundles/angular2.dev.js"></script> 
<script src="node_modules/rxjs/bundles/Rx.js"></script> 
<script src="node_modules/angular2/bundles/router.dev.js"></script> 

<script> 
    System.import('Main'); 

</script>

來源

2016-01-21 09:06:26

我正在通過gulp移動構建文件，但現在我剛剛使用了節點模塊文件夾...我將bootstrap參數更改爲ROUTER_PROVIDERS，現在所有工作都正常。謝謝！ – wiggle

Angular 2：導入路由器包

回答

相關問題