Question

我尝试使用angular2 release candidate 1来实现一个角度2应用程序作为joomla组件。但是我无法使路由工作。我认为这个问题与角度应用程序的URL是

这一事实有关

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>

bootstrapper.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更改为＆＃39; /index.php？option = com_atkstat＆＃39;，包括routerLink和路径 - 但无济于事。任何人？

Answer 1

我想您需要提供自定义RouterUrlSerializer（新RC路由器）和beta.x中的自定义LocationStrategy（RC路由器已弃用），以自定义Angular路由器使用或忽略URL的哪个部分

来自joomla组件的Angular 2路由

1 个答案: