Ich erhalte eine Fehlermeldung und kann nicht herausfinden, warum. Hier ist der Fehler:
EXCEPTION: Error during instantiation of LocationStrategy! (RouterOutlet -> Router -> Location -> LocationStrategy).
angular2.dev.js:23514 EXCEPTION: Error during instantiation of LocationStrategy! (RouterOutlet -> Router -> Location -> LocationStrategy).BrowserDomAdapter.logError @ angular2.dev.js:23514BrowserDomAdapter.logGroup @ angular2.dev.js:23525ExceptionHandler.call @ angular2.dev.js:1145(anonymous function) @ angular2.dev.js:14801NgZone._notifyOnError @ angular2.dev.js:5796collection_1.StringMapWrapper.merge.onError @ angular2.dev.js:5700run @ angular2-polyfills.js:141(anonymous function) @ angular2.dev.js:5719zoneBoundFn @ angular2-polyfills.js:111lib$es6$promise$$internal$$tryCatch @ angular2-polyfills.js:1511lib$es6$promise$$internal$$invokeCallback @ angular2-polyfills.js:1523lib$es6$promise$$internal$$publish @ angular2-polyfills.js:1494(anonymous function) @ angular2-polyfills.js:243microtask @ angular2.dev.js:5751run @ angular2-polyfills.js:138(anonymous function) @ angular2.dev.js:5719zoneBoundFn @ angular2-polyfills.js:111lib$es6$promise$asap$$flush @ angular2-polyfills.js:1305
angular2.dev.js:23514 ORIGINAL EXCEPTION: No base href set. Please provide a value for the APP_BASE_HREF token or add a base element to the document.BrowserDomAdapter.logError @ angular2.dev.js:23514ExceptionHandler.call @ angular2.dev.js:1154(anonymous function) @ angular2.dev.js:14801NgZone._notifyOnError @ angular2.dev.js:5796collection_1.StringMapWrapper.merge.onError @ angular2.dev.js:5700run @ angular2-polyfills.js:141(anonymous function) @ angular2.dev.js:5719zoneBoundFn @ angular2-polyfills.js:111lib$es6$promise$$internal$$tryCatch @ angular2-polyfills.js:1511lib$es6$promise$$internal$$invokeCallback @ angular2-polyfills.js:1523lib$es6$promise$$internal$$publish @ angular2-polyfills.js:1494(anonymous function) @ angular2-polyfills.js:243microtask @ angular2.dev.js:5751run @ angular2-polyfills.js:138(anonymous function) @ angular2.dev.js:5719zoneBoundFn @ angular2-polyfills.js:111lib$es6$promise$asap$$flush @ angular2-polyfills.js:1305
angular2.dev.js:23514 ORIGINAL STACKTRACE:BrowserDomAdapter.logError @ angular2.dev.js:23514ExceptionHandler.call @ angular2.dev.js:1157(anonymous function) @ angular2.dev.js:14801NgZone._notifyOnError @ angular2.dev.js:5796collection_1.StringMapWrapper.merge.onError @ angular2.dev.js:5700run @ angular2-polyfills.js:141(anonymous function) @ angular2.dev.js:5719zoneBoundFn @ angular2-polyfills.js:111lib$es6$promise$$internal$$tryCatch @ angular2-polyfills.js:1511lib$es6$promise$$internal$$invokeCallback @ angular2-polyfills.js:1523lib$es6$promise$$internal$$publish @ angular2-polyfills.js:1494(anonymous function) @ angular2-polyfills.js:243microtask @ angular2.dev.js:5751run @ angular2-polyfills.js:138(anonymous function) @ angular2.dev.js:5719zoneBoundFn @ angular2-polyfills.js:111lib$es6$promise$asap$$flush @ angular2-polyfills.js:1305
angular2.dev.js:23514 Error: No base href set. Please provide a value for the APP_BASE_HREF token or add a base element to the document.
at new BaseException (angular2.dev.js:8080)
at new PathLocationStrategy (router.dev.js:1203)
at angular2.dev.js:1380
at Injector._instantiate (angular2.dev.js:11923)
at Injector._instantiateProvider (angular2.dev.js:11859)
at Injector._new (angular2.dev.js:11849)
at InjectorDynamicStrategy.getObjByKeyId (angular2.dev.js:11733)
at Injector._getByKeyDefault (angular2.dev.js:12048)
at Injector._getByKey (angular2.dev.js:12002)
at Injector._getByDependency (angular2.dev.js:11990)
Weiß jemand, warum der Router dies auslöst? Ich benutze Angular2 Beta
Hier ist mein Code:
import {Component} from 'angular2/core';
import { RouteConfig, ROUTER_DIRECTIVES } from 'angular2/router';
import {LoginComponent} from './pages/login/login.component';
import {DashboardComponent} from './pages/dashboard/dashboard.component';
@Component({
selector: 'app',
directives:[ROUTER_DIRECTIVES],
template:`
<div class="wrapper">
<router-outlet></router-outlet>
</div>`
})
@RouteConfig([
{ path: '/',redirectTo: '/dashboard' },
{ path: '/login',name:'login',component: LoginComponent },
{ path: '/dashboard',name:'dashboard',component: DashboardComponent,}
])
export class AppComponent {
}
bootstrap(AppComponent, [ROUTER_PROVIDERS, provide(APP_BASE_HREF, {useValue : '/'})]);
import {provide} from 'angular2/core';
zu können.import {APP_BASE_HREF} from 'angular2/router';
<base href="https://stackoverflow.com/" />
in der Datei (für festgelegt wurde"/"
,"./"
,"#"
oder jede andere Basispfad, unabhängig davon , wie die Bildpfade sich in dem Muster angegeben wurden). Die einzige Lösung, die schließlich funktionierte, warAPP_BASE_HREF
stattdessen zu verwenden . Ein echter Lebensretter!Ich hatte ein ähnliches Problem mit Angular4- und Jasmine-Unit-Tests. Die unten angegebene Lösung hat bei mir funktioniert
Fügen Sie die folgende Importanweisung hinzu
Fügen Sie die folgende Anweisung für die TestBed-Konfiguration hinzu:
quelle
Sie können auch die Hash-basierte Navigation verwenden, indem Sie Folgendes in app.module.ts aufnehmen
und indem Sie dem @NgModule Folgendes hinzufügen ({...})
„HashLocationStrategy - Der URL wird ein Hash-Zeichen (#) hinzugefügt, und das URL-Segment nach dem Hash identifiziert die Route, die als Webseitenfragment verwendet werden soll, eindeutig. Diese Strategie funktioniert mit allen Browsern, einschließlich der alten. “
Auszug aus: Yakov Fain Anton Moiseev. "Angular 2-Entwicklung mit TypeScript."
quelle
Seit 2.0 Beta :)
quelle
Es ist nur so, dass der folgende Code im head-Tag index.html hinzugefügt wird
das hat für mich wie ein Zauber gewirkt.
quelle
Mit Angular 4 können Sie dieses Problem beheben, indem Sie die Datei app.module.ts wie folgt aktualisieren :
Fügen Sie die Importanweisung oben wie folgt hinzu:
Und fügen Sie die folgende Zeile hinzu
@NgModule
Reff: https://angular.io/api/common/APP_BASE_HREF
quelle
Angular 7,8 Fix befindet sich in app.module.ts
innerhalb von @NgModule hinzufügen
providers: [{provide: APP_BASE_HREF, useValue: '/'}]
quelle
Überprüfen Sie Ihre index.html. Wenn Sie das folgende Teil versehentlich entfernt haben, fügen Sie es hinzu, und es ist in Ordnung
quelle