Angular2 ne Peut pas résoudre tous les paramètres pour RouterOutlet: (RouterOutletMap, ViewContainerRef, ?, de nom)
Je suis totalement nouveau pour toute JS cadre. Juste commencé à apprendre Angulaire 2. Je fais une application de base pour le stage. Angulaires app je poste le nom de Java contrôleur, que d'obtenir l'information nécessaire et l'envoie de nouveau. Fondamentalement, le plaisir se produit lorsque le nom est 'Dave' ou 'Hal'.
Tout a l'air bien, mais lorsque je lance le serveur et essayer d'obtenir à mon application, j'obtiens
EXCEPTION: Erreur: Uncaught (promettre): ne Peut pas résoudre tous les paramètres pour RouterOutlet: (RouterOutletMap, ViewContainerRef, ?, nom).
Aussi loin que je peux dire à partir de la documentation, le paramètre manquant est componentFactoryResolver
. Comment se débarrasser de cette erreur et de l'exécuter convenablement.
Voici les fichiers:
la app/main.ts
import { bootstrap } from '@angular/platform-browser-dynamic';
import { HTTP_PROVIDERS } from '@angular/http';
import { AppComponent } from './app.component';
import { APP_ROUTER_PROVIDERS } from './app.routes';
bootstrap(AppComponent, [
APP_ROUTER_PROVIDERS,
HTTP_PROVIDERS
])
.catch(err => console.error(err));
la app/app.component.ts
import { Component } from '@angular/core';
import { ROUTER_DIRECTIVES } from '@angular/router';
@Component({
selector: 'my-app',
template: `
<h1>{{title}}</h1>
<router-outlet></router-outlet>
`,
directives: [ROUTER_DIRECTIVES]
})
export class AppComponent {
title = 'Names';
}
la app/app.routes.ts
import { provideRouter, RouterConfig } from '@angular/router';
import { HelloComponent } from './hello.component';
import { DaveComponent } from './dave.component';
import { HalComponent } from './hal.component';
export const routes: RouterConfig = [
{ path: '', redirectTo: '/hello' },
{ path: 'index.html', redirectTo: '/hello' },
{ path: 'hello', component: HelloComponent },
{ path: 'dave', component: DaveComponent },
{ path: 'hal', component: HalComponent }
];
export const APP_ROUTER_PROVIDERS = [
provideRouter(routes)
];
la app/hello.component.ts
import { Component, OnInit } from '@angular/core';
import { Router } from '@angular/router';
import { Headers, Http, Response } from '@angular/http';
import 'rxjs/Rx';
@Component({
selector: 'my-hello',
templateUrl: 'app/hello.component.html'
})
export class HelloComponent implements OnInit{
public name = 'stranger';
constructor(
private router: Router,
private http: Http) {
}
ngOnInit() {
this.name = 'stranger';
}
sendName(name: string) {
this.post(name);
}
post(name: string) {
let headers = new Headers({
'Content-Type': 'application/json'});
this.http
.post('names', name, {headers: headers})
.subscribe((res:Response) => this.processResponse(res),
(err) => this.handleError(err));
}
processResponse(response: Response) {
if (response.status == 418) {
return;
} else if (response.json().page == "/dave" || response.json().page == "/hal") {
let messageString = response.json().message;
this.router
.navigate([response.json().page, { queryParams: { message: messageString } }]);
} else {
this.name = response.json().name;
}
}
handleError(error: any) {
this.name = (error.message) ? error.message :
error.status ? `${error.status} - ${error.statusText}` : 'Server error';
}
}
la app/hal.component.ts
(dave.component.ts
ressemble presque la même chose mais avec dave dans les lieux de hal)
import { Component, OnInit, OnDestroy } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { User } from './user';
@Component({
selector: 'my-hal',
templateUrl: 'app/hal.component.html'
})
export class HalComponent implements OnInit, OnDestroy {
user = new User();
sub: any;
constructor(
private route: ActivatedRoute) {
}
ngOnInit() {
this.sub = this.route.params.subscribe(params => {
this.user.message = params['message'];
});
}
ngOnDestroy() {
this.sub.unsubscribe();
}
}
- Pouvez-vous faire un plunker afin que nous puissions essayer? Aussi, avez-vous besoin
terminal: true
dans votre parcours comme indiqué ici: angular.io/docs/ts/latest/guide/router.html#!#redirection - Je pourrais, mais ne savent pas comment le faire fonctionner à la volée. Je veux dire toutes les dépendances node, Java de base et d'autres choses.
- Ne peut pas résoudre tous les paramètres pour RouterOutlet: (RouterOutletMap, ViewContainerRef, ?, nom).
- Voici un petit exemple de routage comme indiqué sur le site officiel github.com/lohiarahul/Angular2-Silverlight-Starter Il se casse dès que je l'ai mise à niveau du routeur de la version de la récente version bêta. Et btw, grande série sur pluralsight, j'ai commencé là.
- J'ai suivi officiel docs et tutos de anguleux.io, mais qu'il se casse. Après quelques tripoter les fichiers, maintenant ça marche mais maintenant j'ai des problèmes avec les paramètres de la requête. Ce que je n'ai énumérés ci-dessous.
Vous devez vous connecter pour publier un commentaire.
Pour toute personne ayant ce problème.
Cela peut se produire lorsque l'une dépendance Angulaire est mis à jour par mnp, tandis que certains autre composant interne de points à une version précédente.
Le point d'interrogation dans l'erreur signifie que Angulaire a omis de fournir une instance de la troisième DI paramètre dans la RouterOutlet composant. Quand on l'examine de près dans le Débogueur, nous pouvons voir clairement (Et clairement je veux dire après la lecture de la ligne 2486 de l'routing.umd.js fichier) que le troisième paramètre "ComponentFactoryResolver" est manquant.
Je recommande les étapes suivantes.
De ne pas avoir à inverser le routeur version. Tout ce qui fonctionne maintenant sur 3.0.0-beta.1.
Maintenant il fonctionne comme on le suppose, je ne suis pas d'erreur plus (pas que je n'obtiens pas les autres maintenant, mais qui n'ont rien à voir avec la question).
CE que j'ai FAIT triés par plausibilité de la résolution de problème
Précompilés composants dans app.composant
precompile: [HelloComponent, HalComponent, DaveComponent]
Rediriger maintenant réglé chemin d'accès complet du match
export const routes: RouterConfig = [
{ path: '', redirectTo: '/hello', pathMatch: 'full' }
...
];
Moi aussi j'ai eu ce message d'erreur "ne Peut pas résoudre tous les paramètres pour RouterOutlet: (RouterOutletMap, ViewContainerRef, ?, nom)."
Pour moi, le routage des pauses après je mettre à 3.0.0-beta.1 3.0.0-alpha.8. Essayant de revenir à la version alpha.