Angular2 Bileşen Yönlendirici temel sorunu

Açısal öğrenme beta başlangıç bileşenini yönlendirme. Bunu şimdiye kadar yaptım.Angular2 Bileşen Yönlendirici temel sorunu

http://plnkr.co/edit/4YWWGhuBWd2CoWpC3GeY?p=preview

ben gerekli CDN'lerin aşağıdaki kopyaladığınız. lütfen buraya bir göz atın.

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.0/angular2-polyfills.js"></script> 
    <script src="https://rawgithub.com/systemjs/systemjs/0.19.6/dist/system.js"></script> 
    <script src="https://code.angularjs.org/tools/typescript.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.0/Rx.js"></script> 


    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.0/angular2.dev.js"></script> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/2.0.0-beta.0/router.dev.js"></script>

src/boot.ts

import {Component} from 'angular2/core'; 
import {ROUTER_PROVIDERS,RouteConfig, ROUTER_DIRECTIVES,LocationStrategy} from 'angular2/router'; 
import {bootstrap}  from 'angular2/platform/browser'; 

import{ComponentOne} from 'src/cone'; 
import{ComponentTwo} from 'src/ctwo'; 

@Component({ 
    selector: 'my-app', 
    template: ` 
    <h1>Component Router</h1> 
    <nav> 
     <a [routerLink]="['ComponentOne']">One</a><hr/> 
     <a [routerLink]="['ComponentTwo']">Two</a> 
    </nav> 
    <router-outlet></router-outlet> 
    `, 
    directives: [ROUTER_DIRECTIVES] 
}) 
@RouteConfig([ 
    {path:'/component-one', name: 'ComponentOne', component: ComponentOne}, 
    {path:'/component-two', name: 'ComponentTwo', component: ComponentTwo} 
]) 
export class AppComponent { } 

    bootstrap(AppComponent, [ 
     ROUTER_PROVIDERS 
]);

src/koni

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

@Component({ 
    template: ` 
    <h1>first Component</h1> 
    ` 
    }) 

    export class ComponentOne{ 
    constructor(){ 

     console.log("first component being called"); 
    } 
    }

src/ctwo

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

@Component({ 
    template: ` 
    <h1>Second Component</h1> 
    ` 
    }) 

    export class ComponentTwo{ 
    constructor(){ 

     console.log("Second component being called"); 
    } 
    }

Lütfen dev konsolunuzu kontrol edin.

Bir hata verir. EXCEPTION: LocationStrategy'nin başlatılması sırasında hata! (RouterLink -> Router -> Konum -> LocationStrategy) .BrowserDomAdapter.logError @ angular2.dev.js: 23514 angular2.dev.js: 23514 ORİJİNAL GÖREV: Hiçbir temel ayarlanmadı. Lütfen APP_BASE_HREF belirteci için bir değer belirtin veya belgeye temel bir öğe ekleyin. ve ek olarak, beni hedefe yönlendirmiyor. < taban href = "/"> eklemeye çalıştım ama bir hata veriyor.

Bağlantıların düzgün bir şekilde çalışmasını istiyorum.

kaynak

2016-01-07 nyks

en ROUTING & NAVIGATION developer guide Bkz "Bu bir hata ve veriyor ..."? –

Senin için plnkr yaptım. çalıştırın ve tarayıcı konsolunda kontrol edin. tek hata yok. – nyks

'' öğesini nereye eklediniz? –

Ya <base href="/"><head> eleman eklemek veya Nyks tarafından Düzenlendi

bootstrap(AppComponent, [ 
    ROUTER_PROVIDERS, 
    // usually 
    provide(APP_BASE_HREF, {useValue: '/'}) 
    // for Plunker 
    // bind(APP_BASE_HREF).toValue(location.pathname) 
]);

Cevap bootstrap APP_BASE_HREF ekleyin: Ben şu parçaları güncelledik benim plunker olarak

import {Component,bind} from 'angular2/core'; 
import {ROUTER_PROVIDERS,RouteConfig, ROUTER_DIRECTIVES,APP_BASE_HREF,LocationStrategy,RouteParams,ROUTER_BINDINGS} from 'angular2/router'; 

export class AppComponent { } 

    bootstrap(AppComponent, [ 
     ROUTER_PROVIDERS,bind(APP_BASE_HREF).toValue(location.pathname) 
]);

final Cevap: http://plnkr.co/edit/4YWWGhuBWd2CoWpC3GeY?p=preview

da http://plnkr.co/edit/iRUP8B5OUbxCWQ3AcIDm?p=info

ve hata iletisi Neler angular.io

kaynak

2016-01-07 11:27:55

Angular2 Bileşen Yönlendirici temel sorunu

cevap

İlgili konular