Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- /////////////////////////////// Module dédié au routing
- @NgModule({
- imports: [
- RouterModule.forRoot([
- {
- path: 'une-url', // url de la route, que l'on entre par exemple dans la barre d'adresse pour accéder à la route.
- component: ComposantCorrespondantALUrl // component qui sera affiché dans le html sur cette route.
- redirectTo: 'etc...'
- // Toute adresse préfixée par la valeur saisie dans path sera redirigé vers l'url saisie dans redirectTo.
- // Il est possible de rediriger uniquement si l'url saisie est exactement celle qui est saisie
- // dans path, en ajoutant pathMatch:'full'
- },
- {
- path: 'une-autre-url',
- component: UnAutreComposant
- },
- etc...
- ])
- ],
- exports: [
- RouterModule
- ]
- })
- export class AppRoutingModule {}
- //////////////////////////////////////// url dynamiques
- 'www.monsuperblog.com/posts/:post_id' //ou :post_id correspond à une "variable" représentant l'id du post.
- // dans votre composant :
- export class MonComposant {
- constructor (route:ActivatedRoute) { }
- ngOnInit () {
- this.route.params.subscribe((params: Params) => {
- const ID = params['id'];
- });
- }
- }
- ///////////////////////////////////// à rajouter dans la template du composant racine du projet
- '<router-outlet>' //Le point d'entrée dans nos templates sur lequel vont venir se greffer les composants
- ///////////////////////////////////// navigation via la template
- '<a routerLink="/mon-url">Bla</a>' // version simple
- '<a [routerLink]="['/posts', idDePoste]">Bla</a>' //version bindé aux valeurs du composant
- //////////////////////////////////// navigation a partir du code du composant
- export class MonComposant {
- constructor (private router:Router) { }
- etc...
- superMethodeDeComposant (id:string) {
- this.router.navigate(['/posts', id]);
- }
- etc...
- //////////////////////////////////// retour simple
- window.history.back();
- ////////////////////////////////////// ne pas oublier :
- <base HREF="/"> // dans le code de la page index.html
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement