2016-05-30 78 views
0

我想实现一个角2应用作为joomla组件,使用angular2发布候选人1。但我有麻烦让路由工作。我认为这个问题有事情做与事实的URL角应用是从joomla组件角2路由

localhost/index.php?=com_mycomponent 

我有以下代码:

的index.html

<html> 
    <head> 
    <title>Test</title> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <!--CSS--> 
    <!--<link rel="stylesheet" href="components/com_mycomponent/app/lib/bootstrap.min.css">--> 
    <link rel="stylesheet" href="components/com_mycomponent/app/styles/styles.css"> 

    <!-- 1. Load libraries --> 
    <!-- IE required polyfills, in this exact order --> 
    <script src="components/com_mycomponent/app/lib/shim.min.js"></script> 
    <script src="components/com_mycomponent/app/lib/zone.js"></script> 
    <script src="components/com_mycomponent/app/lib/Reflect.js"></script> 

    <script src="components/com_mycomponent/lib/system.src.js"></script> 
    <script src="components/com_mycomponent/app/lib/system.config.js""></script> 

    <script> 
     System.import('components/com_mycomponent/app/scripts/bootstrapper').catch(function(err){ console.error(err); }); 
    </script> 
    <base href="/"> 
</head> 

<!-- 3. Display the application --> 
<body> 
    <body> 
     <my-app>Loading...</my-app> 
    </body> 
</body> 
</html> 

引导程序.ts

import {bootstrap} from '@angular/platform-browser-dynamic'; 
import { ROUTER_PROVIDERS } from '@angular/router'; 
import {ShellComponent} from './shell.component'; 
import {HTTP_PROVIDERS} from '@angular/http'; 

bootstrap(ShellComponent, [ 
    HTTP_PROVIDERS, 
    ROUTER_PROVIDERS 
    ]); 

shell.component.ts

import {Component} from '@angular/core'; 
import {Http} from '@angular/http'; 
import { ROUTER_DIRECTIVES, Routes} from '@angular/router'; 

import {BComponent} from 'b.component'; 
import {AComponent} from 'a.component'; 


@Component({ 
    selector: 'my-app', 
    templateUrl: 'components/com_mycomponent/app/html/shell.html', 
    directives: [ROUTER_DIRECTIVES] 
}) 

@Routes([ 
    { 
     path: '/b', 
     component: BComponent 
    }, 
    { 
     path: '/', 
     component: AComponent 
    } 
]) 
export class ShellComponent{ 
    constructor() { 
    } 

    // ngOnInit() { 
    //  this.router.navigate(['/egendefinertrapport']); 
    // } 
} 

shell.html

<a [routerLink]="['/b']">BComponent</a> 

,我得到了以下错误消息:

EXCEPTION: Error: Uncaught (in promise): TypeError: Cannot read property 'annotations' of undefined 

我试图改变的bash href改为'/index.php?option=com_atkstat',包括routerLink和路径 - 但无济于事。任何接受者?

回答

0

我想你需要提供一个自定义RouterUrlSerializer(新的RC路由器)和一个定制LocationStrategy beta.x(RC路由器废弃)来定制哪些部分的URL被Angular路由器使用或忽略。