目前我有帶路由的角度應用程式。從應用程式訪問時路由作業正常，但是當我嘗試將某些鏈接復制并粘貼到新選項卡中時，我發現無法加載模塊。示例http://localhost:4200/updates在應用程式和新選項卡中打開都可以正常作業，但是http://localhost:4200/updates/repositories/Test/units（測驗是從呼叫組件傳遞的引數）此 url 僅在應用程式中有效，當粘貼到新選項卡中時，我看到的錯誤是：
Uncaught SyntaxError: expected expression, got '<' scripts.91672879d55182c59502.js:1
Loading module from “http://localhost:4200/updates/repositories/sumDev/main-es2017.233f600c1169f07fe825.js” was blocked because of a disallowed MIME type (“text/html”).
units Loading failed for the module with source “http://localhost:4200/updates/repositories/sumDev/main-es2017.233f600c1169f07fe825.js”.
這是我的依賴設定：
"dependencies": {
"@angular-devkit/build-angular": "^0.1102.14",
"@angular/animations": "~11.2.14",
"@angular/cdk": "^11.2.13",
"@angular/common": "~11.2.14",
"@angular/compiler": "~11.2.14",
"@angular/core": "~11.2.14",
"@angular/forms": "~11.2.14",
"@angular/localize": "^11.2.14",
"@angular/material": "^11.2.13",
"@angular/platform-browser": "~11.2.14",
"@angular/platform-browser-dynamic": "~11.2.14",
"@angular/router": "~11.2.14",
"@auth0/angular-jwt": "^5.0.2",
"@delite/dlt-icons": "^1.1.5",
"classlist.js": "^1.1.20150312",
"hammerjs": "^2.0.8",
"keycloak-angular": "^8.2.0",
"keycloak-js": "^13.0.0",
"net": "^1.0.2",
"ng-http-loader": "^5.1.0",
"rxjs": "~6.6.7",
"sockjs-client": "^1.6.1",
"stompjs": "^2.3.3",
"tslib": "^2.0.0",
"zone.js": "~0.11.3"
},
"devDependencies": {
"@angular/cli": "~11.2.14",
"@angular/compiler-cli": "~11.2.14",
"@angular/language-service": "~11.2.14",
"@types/core-js": "^2.5.4",
"@types/jasmine": "~3.6.0",
"@types/jasminewd2": "~2.0.3",
"@types/node": "^12.11.1",
"codelyzer": "^6.0.0",
"jasmine-core": "~3.6.0",
"jasmine-spec-reporter": "~5.0.0",
"karma": "^6.3.4",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage-istanbul-reporter": "~3.0.2",
"karma-jasmine": "~4.0.0",
"karma-jasmine-html-reporter": "^1.5.0",
"protractor": "~7.0.0",
"ts-node": "~7.0.0",
"tslint": "~6.1.0",
"typescript": "^4.0.8"
}
這是路由模塊：
const routes: Routes = [{
path: '',
canActivate: [AuthGuard],
children: [
{
path: '',
redirectTo: "installer",
pathMatch: "full"
},{
path: 'updates',
component: UpdateRepositoryComponent,
children: [
{
path: 'repositories/:name/units',
component: UnitsComponent,
}
]
}]
}]
@NgModule({
imports: [RouterModule.forRoot(routes, {relativeLinkResolution: 'legacy'})],
exports: [RouterModule]
})
export class AppRoutingModule {}
這就是我導航this.router.navigate([this.router.url /repositories/${name}/units的方式]);
uj5u.com熱心網友回復：
是的，您可以使用
window.open(url, '_blank');
或檢查此答案
uj5u.com熱心網友回復：
您所描述的是客戶端站點渲染的性質 - CSR，它僅在您通過代碼導航時才有效。
簡而言之，直接輸入 url 會觸發一個服務器請求，好吧，你沒有服務器來處理這個請求，所以會發生錯誤。可以在帶有 CSR 關鍵字的谷歌上找到更多相關資訊。
uj5u.com熱心網友回復：
設法通過使用 HashLocationStrategy 解決了這個問題。這會在 url 的前面添加 # 并幫助路由。你可以在這里找到完整的解釋和例子
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/522724.html
標籤：有角度的角材料导航