Ich versuche, eine angular 2 App als Joomla-Komponente zu implementieren, mit angular2 Release-Kandidat 1. Aber ich habe Probleme, Routing zu arbeiten. Ich denke, das Problem etwas mit der Tatsache zu tun, dass die URL der Winkel AppAngular 2 Routing von Joomla Komponente
localhost/index.php?=com_mycomponent
ist, ich habe den folgenden Code:
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>
Bootstrap .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>
Und ich die folgende Fehlermeldung erhalten:
EXCEPTION: Error: Uncaught (in promise): TypeError: Cannot read property 'annotations' of undefined
Ich habe versucht, die bash zu ändern href zu '/index.php?option=com_atkstat', einschließlich der RouterLink und Pfade - aber ohne Erfolg. Irgendwelche Abnehmer?