嗨，在我的代码中，当我从Server收到回复时，我正在导航到不同的html页面。在将我的角度版本5更新为7之前，一切正常。在版本升级后，相同的代码引发以下错误。
错误错误：未捕获（承诺）：错误：无法匹配任何路由。 URL段：“ uploads / dockerExcecutionDependency / vnc.html” 错误：无法匹配任何路线。 URL段：“ uploads / dockerExcecutionDependency / vnc.html” 在ApplyRedirects.push ../ node_modules/@angular/router/esm5/router.js.ApplyRedirects.noMatchError（router.js：1765） 在CatchSubscriber.selector（router.js：1730） 在CatchSubscriber.push ../ node_modules / rxjs / _esm5 / internal / operators / catchError.js.CatchSubscriber.error（catchError.js：34） 在MapSubscriber.push ../ node_modules / rxjs / _esm5 / internal / Subscriber.js.Subscriber._error（Subscriber.js：79） 在MapSubscriber.push ../ node_modules / rxjs / _esm5 / internal / Subscriber.js.Subscriber.error中（Subscriber.js：59） 在MapSubscriber.push ../ node_modules / rxjs / _esm5 / internal / Subscriber.js.Subscriber._error（Subscriber.js：79） 在MapSubscriber.push ../ node_modules / rxjs / _esm5 / internal / Subscriber.js.Subscriber.error中（Subscriber.js：59） 在MapSubscriber.push ../ node_modules / rxjs / _esm5 / internal / Subscriber.js.Subscriber._error（Subscriber.js：79） 在MapSubscriber.push ../ node_modules / rxjs / _esm5 / internal / Subscriber.js.Subscriber.error中（Subscriber.js：59） 在TapSubscriber.push ../ node_modules / rxjs / _esm5 / internal / operators / tap.js.TapSubscriber._error（tap.js：61） 在resolvePromise（zone.js：814） 在resolvePromise（zone.js：771） 在zone.js：873 在ZoneDelegate.push ../ node_modules / zone.js / dist / zone.js.ZoneDelegate.invokeTask（zone.js：421） 在Object.onInvokeTask（core.js：14051） 在ZoneDelegate.push ../ node_modules / zone.js / dist / zone.js.ZoneDelegate.invokeTask（zone.js：420） 在Zone.push ../ node_modules / zone.js / dist / zone.js.Zone.runTask（zone.js：188） 在排水微任务队列（zone.js：595）
请在收到服务器回复后找到我将url发送到html的组件代码
ngOnInit() {
this.dockerIpPort();
}
///////////////////////
dockerIpPort()
{
var objDocker={};
objDocker["ipAddress"]="192.168.99.100";
objDocker["vncPort"]="32768";
objDocker["vncPassword"]="secret";
this.servicekey.dockerIpPortServiceCall(objDocker).subscribe(
result => {
let url = "/uploads/dockerExcecutionDependency/vnc.html"
this.dockerPath09 =
this.sanitizer.bypassSecurityTrustResourceUrl(url);
document.getElementById("activateDockerButton").click();
});
}//dockerIpPort
我使用URL导航的html代码。
<div>
<div class = "modal fade" id = "myModal04">
<div class = "modal-dialog modal-lg">
<div class = "modal-content docker">
<div class="modal-footer dockerFooter">
<p>Close</p>
<button type="button" class="btn btn-default dockerClose" data-dismiss="modal"><span class="glyphicon glyphicon-remove-circle"></span></button>
</div>
<div class = "modal-body dockerbody">
<iframe [src]="dockerPath09" height="100%" width="100%">
<p>Your browser does not support iframes.</p>
</iframe>
</div>
<div class="modal-footer">
</div>
</div>
</div>
</div>
</div>
<!-- myModal04 -->
请向我建议一种更好的方法来修复此错误。在此先感谢
请查找app.module.ts文件
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { Router } from '@angular/router';
import { RouterModule, Routes } from '@angular/router';
import { HttpModule } from '@angular/http';
import { FormsModule } from '@angular/forms';
import { FileDropModule } from 'ngx-file-drop';
import { HttpClientModule } from '@angular/common/http';
import { AppComponent } from './app.component';
import { HeaderComponent } from './header.component';
import { LoginComponent } from './login.component';
import { ProjectDetailComponent } from './pDetail.component';
import { LoginServiceComponent } from './login.service';
import { ProjectSelectionServiceComponent } from
'./projectSelection.service';
import { SelectionComponent } from './projectSelection.component';
import { ModuleComponent } from './module.component';
import { FeatureComponent } from './featurePage.component';
import { TestExecutionComponent } from './testExecution.component';
import { BrowserAnimationsModule } from '@angular/platform-
browser/animations';
import {apiServiceComponent} from './apiService';
import { ReactiveFormsModule } from '@angular/forms';
import { ObjectComponent } from './object.component';
import { PageNameComponent } from './pageName.component';
import { ObjectNameComponent } from './objectName.component';
import { ObjectServiceComponent } from './object.service';
import { CaptureLabComponent } from './captureLab.component';
import { ImportProjectComponent } from './importProject.component';
import { ModuleServiceComponent } from './modulePage.service';
import { FeatureServiceComponent } from './featurePage.service';
import { ImportComponent } from './importPage.component';
import { ImportServiceComponent } from './importPage.service';
import { ProjectDetailServiceComponent } from './pDetail.service'
import { AmazingTimePickerModule } from 'amazing-time-picker';
import { ScriptImportComponent } from './script-import/script-
import.component';
import { EditComponent } from './edit/edit.component';
import { CreateTestCaseComponent } from './create-test-case/create-
test-
case.component';
import { ReportComponent } from './report/report.component';
import { ObjectCreationComponent } from './object-creation/object-
creation.component';
import { CreateReusableFunctionComponent } from './create-reusable-
function/create-reusable-function.component'; // this line you need
import{ CreatesuiteComponent } from './createsuite.component';
import { ExecutionComponent } from './execution.component';
import { AIComponent } from './ai/ai.component';
import { TestCaseCommonService } from './test-case-common.service'
import { NewCreateTestCaseComponent } from './new-create-test-
case/new-create-test-case.component';
import { Ng2GoogleChartsModule } from 'ng2-google-charts';
import { SuitelevelComponent } from
'./suitelevel/suitelevel.component';
import { FeatureLevelComponent } from './feature-level/feature-
level.component';
import { ScriptLevelComponent } from './script-level/script-
level.component';
import { StepLevelComponent } from './step-level/step-level.component';
import { ChartModule } from 'angular2-chartjs';
import { ExecutionService } from './service/execution.service';
import {GraphReportService} from './service/graph-report.service';
import {ShContextMenuModule} from 'ng2-right-click-menu';
const appRoutes: Routes = [
{ path: 'ImportPage', component: ImportComponent },
{ path: 'createProject', component: ImportProjectComponent },
{path: '', component: ProjectDetailComponent,
children: [
{ path: 'CreateModule', component: ModuleComponent },
{ path: 'CreateFeature', component: FeatureComponent },
{ path: 'importComponent', component: ImportComponent },
{ path: 'editComponent', component: EditComponent },
{ path: 'createTestCaseComponent', component: CreateTestCaseComponent
},
{ path: 'captureLabComponent', component: CaptureLabComponent },
{ path: 'testExcecutionComponent', component: TestExecutionComponent
},
{ path: 'reportComponent', component: ReportComponent },
{ path: 'objectCreationComponent', component: ObjectCreationComponent
},
{ path: 'objectRepository', component: ObjectComponent },
{path: 'createReusableFunction', component:
CreateReusableFunctionComponent },
{path: 'createsuitecomponent' ,component: CreatesuiteComponent},
{ path: 'executionComponent', component: ExecutionComponent },
{ path: 'Artificialpath', component: AIComponent },
{path:'suitelevel',component:SuitelevelComponent},
{path:'featurelevel',component:FeatureLevelComponent},
{path:'scriptlevel',component:ScriptLevelComponent},
{path:'steplevel',component:StepLevelComponent},
{ path: 'NewCreateTestCaseComponent', component:
NewCreateTestCaseComponent,
children: [
{
path:'check',component:StepLevelComponent
}
]
}
]
},
{ path: 'projectSelection', component: SelectionComponent },
{ path: 'logincomponent', component: LoginComponent },
{ path: 'createsuitecomponent', component: CreatesuiteComponent },
{ path: 'executionComponent', component: ExecutionComponent },
];