Ich habe versucht, eine TypeScript Angular 1-Anwendung für die Verwendung von ES6-Stilmodulimporten zu konvertieren.Einfaches Beispiel mit Angular 1 mit TypeScript und SystemJS
Dropping die Verwendung von Namespace und mit dem Import Stichwort in Module zu ziehen. z.B.
Aber ich habe einige Probleme bekommen. ich einen Fehler von Winkel bekommen:
Uncaught (in Versprechen) Fehler: (SystemJS) [$ Injektor: modulerr] Fehler beim Modul testApp aufgrund instanziiert:
Fehler: [$ Injektor: modulerr] konnte nicht instanziiert modul ngRoute wegen:
Fehler: [$ injector: nomod] Modul 'ngRoute' ist nicht verfügbar! Sie haben entweder den Modulnamen falsch geschrieben oder vergessen, ihn zu laden. Wenn ein Modul Registrierung sicherzustellen, dass Sie die Abhängigkeiten als zweites Argument angeben
Um das Problem zu veranschaulichen, ich habe zwei Anwendungen auf Github erstellt:
1) Angular1WithNamespaces - Original-Anwendung, die ich konvertieren mag.
2) Angular1WithSystemJS - Meine Konvertierung, die ein Problem hat.
Im Folgenden finden Sie Ausschnitte aus dem Angular1WithSystemJS-Beispiel, das das Problem aufweist.
index.html
<!DOCTYPE html>
<html lang="en" ng-app="testApp">
<head><base href="/"></head>
<body >
<ng-view></ng-view>
<script src="node_modules/systemjs/dist/system.js"></script>
<script src="configs/systemjs.config.js"></script>
<script>
System.import('app/boot');
</script>
</body>
</html>systemjs.config.js
System.config({
defaultJSExtensions: true,
paths: {
"npm:*": "../node_modules/*"
},
// map tells the System loader where to look for things
map: {
"angular": "npm:angular/angular.js",
"angular-route": "npm:angular-route/angular-route.js",
},
meta: {
'angular': {
format: 'global',
},
'angular-route': {
format: 'global',
},
}
});boot.ts
/// <reference path="../typings/tsd.d.ts" />
import * as angular from "angular";
import * as angularroute from "angular-route";
let main = angular.module("testApp", ["ngRoute"]);
main.config(routeConfig)
routeConfig.$inject = ["$routeProvider"];
function routeConfig($routeProvider: angular.route.IRouteProvider): void {
$routeProvider
.when("/dashboard", {
templateUrl: "/app/dashboard.html",
})
.otherwise("/dashboard");
}Jede Hilfe diese Arbeit bekommen würde sehr geschätzt werden.