4
votes

Obtenir le paramètre d'itinéraire comme nul dans angulaire 7

Je ne parviens pas à récupérer le paramètre d'itinéraire comme nul. J'utilise angular7. Veuillez trouver le code ci-dessous

Fichier ts HeaderComponent

 const routes: Routes = [
        { path: 'news/:typeId', component: XxxComponent },
    { path: '**', component: XxxComponent }
    ];

Header html

<div class=" dropdown-toggle" data-toggle="dropdown">
                XXX
            </div>
            <div class="dropdown-menu">
                <div *ngFor="let cr of country" class="dropdown-item"
                    (click)="getNewsByCountry(cr.value)" >{{cr.name}}</div>
            </div>

fichier ts de routage d'application

    import {Router, ActivatedRoute} from '@angular/router';
    constructor(private httpService: HttpClient, private router: Router, private activatedRoute: ActivatedRoute) {
             this.getNewsSelectedFromRouteParam();
        }
    getNewsSelectedFromRouteParam() {
            alert();
            let id = this.activatedRoute.snapshot.paramMap.get('typeId');
            alert(id);
        }
getNewsByCountry(newsTypeSelected: any) {
        this.router.navigate(['/news',newsTypeSelected]);
        this.getNewsSelectedFromRouteParam();
    }

angular angular-routing angular7 routeparams

5 commentaires

que voulez-vous dire par récupération comme null?

au lieu que la valeur du paramètre racine devienne nulle, mais je suis capable de voir le changement d'URL.

Puisque vous prenez la valeur de l'instantané, elle ne changera pas dynamiquement. Vous devrez vous abonner pour changer les valeurs de typeId

Vous avez le dans votre app.html principale? Une fois, j'ai oublié de l'utiliser et je n'ai pas trouvé la raison pour laquelle je n'obtiens pas les paramètres.

@ Talg123 vous m'avez fait gagner des heures! Merci

4 Réponses :

0
votes

Vous appelez getNewsByCountry en (clic), probablement cr.value est nul, qu'est-ce que cr.value? Est-ce que l'ID?

0 commentaires

7
votes

Il existe deux façons d'accéder à un paramètre d'itinéraire.

Statiquement (une fois lors du chargement de la page)
Dynamiquement (est mis à jour si le paramètre est modifié dans votre application sans recharger la page par navigateur)

Vous pouvez obtenir plus de références ici: https://angular.io/api/router / ActivatedRouteSnapshot

Voir l'extrait suivant pour l'implémentation:

this.activatedRoute.params.subscribe((params) => {
    let id = params.get('typeId');
});

let id = this.activatedRoute.snapshot.params.typeId; // any param name after "params"

Assurez-vous que vous utilisez le code ci-dessus lorsque le composant est initialisé, c'est-à-dire dans ou après ngOnInit ().

2 commentaires

J'obtiens l'identifiant comme "indéfini". J'ai journalisé les paramètres, il s'affiche sous forme de JSON vide. Des pensées sur pourquoi il se vide?

Vous devriez l'appeler dans ngOnInit ()

1
votes

J'essaie d'obtenir ces paramètres dans "HeaderComponent ts" où il doit appeler depuis "XxxComponent". J'ai ajouté ce code de paramètre de route dans le fichier XxxComponent ts fonctionnant maintenant comme prévu. Je peux obtenir les paramètres d'itinéraire.

2 commentaires

Pouvez-vous expliquer ce que vous avez fait? L'itinéraire n'était pas accessible dans le sous-composant ou?

Après avoir trouvé beaucoup de réponses sur StackOverFlow, cette réponse est la seule à résoudre mon problème

0
votes

Vous pouvez également essayer

let id = this.activatedRoute.snapshot.queryParams.id

pour obtenir les paramètres de requête partagés par toutes les routes

0 commentaires