问Angular 7路由路径打开源地图

EN

<div class="page-layout blank p-24" fusePerfectScrollbar>
    <h1>List Row Detail</h1>

    <div class="content pb-24" fxLayoutAlign="start start">
        <form class="mat-white-bg mat-elevation-z4 p-24 w-100p" [formGroup]="detailForm">
            <div fxLayout="column">
                <mat-form-field class="w-350 mr-10 pt-10">
                    <input matInput placeholder="Name" class="w-350" type="text" formControlName="Name" readonly="readonly" />
                </mat-form-field>
            </div>
        </form>
    </div>
</div>


import { Component, OnInit } from '@angular/core';
import { NotificationService } from '../../xxxx/services/notification.service';
import { IdentificationGeneratorService } from '../../xxxx/services/identification-geneterator.service';
import { Notification } from '../../xxxx/models/notification.model';
import { ActivatedRoute } from '@angular/router';
import { FormBuilder } from '@angular/forms';
import { FuseSplashScreenService } from '@fuse/services/splash-screen.service';

@Component({
    selector: 'row-list-detail',
    templateUrl: './row-list-detail.component.html',
    styleUrls: ['./row-list-detail.component.scss'],
})

export class RowListDetailComponent implements OnInit {

    organizationGuid;
    rowListGuid;
    detailForm;

    constructor(private notificationService: NotificationService,
        private formBuilder: FormBuilder,
        private activatedRoute: ActivatedRoute,
        private fuseSplashScreenService: FuseSplashScreenService) {
        this.fuseSplashScreenService.hide();
        this.detailForm = this.formBuilder.group({
            Name: [''],

        });

        this.organizationGuid = this.activatedRoute.snapshot.params['organizationGuid'];
        this.rowListGuid = this.activatedRoute.snapshot.params['rowListGuid']; 

    }
}

import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { FuseSharedModule } from '@fuse/shared.module';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MatFormFieldModule, MatInputModule } from '@angular/material';
import { RowListDetailComponent } from './row-list-detail.component';
import { InformationDialogModule } from '../../xxxx/components/information-dialog/information-dialog.module';

const routes = [
    {
        path: '**',
        component: RowListDetailComponent
    }
];

@NgModule({
    declarations: [
        RowListDetailComponent
    ],
    imports: [
        FuseSharedModule,
        RouterModule.forChild(routes),
        FormsModule,
        ReactiveFormsModule,
        MatFormFieldModule,
        MatInputModule,
        InformationDialogModule
    ],
    exports: [
        RowListDetailComponent
    ]
})

export class RowListDetailModule {
}


<div class="page-layout blank p-24" fusePerfectScrollbar>
    <h1>List</h1>
    
    <ngx-datatable class="material" [rows]="list" [columnMode]="'force'" [headerHeight]="50" [footerHeight]="50"
        [rowHeight]="50" [limit]="20" [sorts]="[{prop: 'Name', dir: 'desc'}]" [cssClasses]="iconsCss">

        <ngx-datatable-column prop="Name" name="Name">
            <ng-template let-row="row" ngx-datatable-cell-template>
                <a [routerLink]="['/Apps/Organizations', organizationGuid , 'Lists', row.rowListGuid, 'Detail']">{{row.Name}} </a>
            </ng-template>
        </ngx-datatable-column>
</div>

import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';

import { FuseSharedModule } from '@fuse/shared.module';
import { MsalGuard } from '@azure/msal-angular';
import { CheckRedirectUrlService } from 'app/xxxx/services/checkredirecturl.service';

const routes = [
    {
        path: 'Organizations/:organizationGuid/Lists/:rowListGuid/Detail',
        loadChildren: './row-list-detail/row-list-detail.module#RowListDetailModule',
        canActivate: [MsalGuard, CheckRedirectUrlService]
    },
    {
        path: 'Organizations/:organizationGuid/Lists',
        loadChildren: './list/list.module#ListModule',
        canActivate: [MsalGuard, CheckRedirectUrlService]
    }

];

@NgModule({
    imports     : [
        RouterModule.forChild(routes),
        FuseSharedModule
    ]
})
export class AppsModule
{
}