angular-ui-router 相关问题

Angular：如何根据条件阻止 RouteReuseStrategy？

我试图根据某些条件阻止 RouteReuseStrategy，但这没有发生。我有一个名为 comp-a 的路线名称，它以两种不同的方式调用。 1 次来自后退按钮和

Spring Boot 与 Angular 集成

有没有办法让我的后端 Spring Boot 项目与 Angular 前端一起运行，而无需启动单独的 Angular 服务器？我可以将整个应用程序仅部署在后端服务器上吗？

如何在 Angular 中解析 JSON 对象

我正在尝试从 Angular 应用程序调用“https://restcountries.com/v3.1/all”，并且在 HTML 页面中显示结果时，我能够解析 Name、flag 、 Capital 但当 tr ...

在 mat-paginator 中 pageSizeOptions 不起作用

我正在使用 Angular Material 开发 Angular 项目。 我正在尝试在表视图中显示数据，使用分页，因为 很多数据。 问题是分页的 pageSizeOptions 选项不可用...

如何使用动态url（slugs）和ng-include在Angular JS中正确返回404？

我目前正在使用 UI-router 使用 AngularJS 为我们公司构建一个投资组合网站。我们正在使用 HTML5 url 方案，并且我已经使用标准 .htaccess 来重写对 index.html 的请求（

如何模拟 AngularJS 模块配置提供程序

在我们的模块中，我们定义了一个自定义方法，它本质上为 $stateProvider 添加了更多功能...... （功能 （） { '使用严格'； 有角的 .module('someModule'...

NG8001：“路由器插座”不是已知元素：

我一开始遇到了问题，我在登录时尝试登录以与main连接，但是当我移动时，我向pro gpt寻求帮助，现在出现了一个错误，我无法以任何方式解决，

使用 angularjs 中的 $rootScope 将值从一个不同的应用程序模块控制器传递到另一个应用程序模块服务

我正在 angularjs 中做项目，我的要求是需要使用 $rootScope 将值从一个不同的应用程序模块控制器传递到另一个应用程序模块服务 这是我的代码部分 登录模块和

错误：NG8001：“路由器出口”不是已知元素：在 Angular 中

我收到以下错误： NG8001：路由器出口不是已知元素： 如果 router-outlet 是 Angular 组件，则验证它是否是该模块的一部分。 如果 router-outlet 是一个 Web 组件...

使用 Angular 和 Node Routing 加载没有 css 和 js 的视图

我正在构建一个使用 Node 和 Angular 路由的应用程序。我想处理 Angular 中的所有路线。 文件夹结构： 民众 图片 CSS js 部分 _search.html 首页.html 索引.html 萨斯 全部

角度路由器中的模块构建失败

嗨，我正在尝试创建一个角度项目，在创建项目后，当我给出 ng 时，它抛出以下错误。我已经删除了节点模块并重新安装，创建了一个新的...

AngularJS：位置更改后刷新视图

我有一个有 2 个视图的应用程序

使用 routerLink 并（单击）同一按钮

这是询问最佳实践。在同一个按钮中使用 routerLink 和（单击）是一个好习惯吗？ 因为我们可以把路由器导航... 这是询问最佳实践。在同一个按钮中使用 routerLink 和（单击）是一个好习惯吗？ <button routerLink="/link" (click)="back()"> 因为我们可以将路由器导航逻辑放在 back() 方法中，如下所示， this.router.navigate(['/link']); 我发现的关于此的所有内容是这篇文章，它没有讨论要遵循的最佳实践。如果其中一个比另一个更好，你能解释一下原因吗？ 以下是一些如何使用 routerLink 和 click , 的示例 希望这会有所帮助： -> 如果您想重定向到某些页面，您可以随时使用此: <a [routerLink]="['/my-book-listing']"> My Books</a> -> 如果您想重定向到页面但想发送一些参数（例如 ID），请使用： <a [routerLink]="['/my-book-details','3']">Book number 3</a> -> 如果您需要向路由发送查询参数，那么您可以使用 <a [routerLink]="['/search-this']" [queryParams]="{text:'sam',category:'social'}">Go Search</a> -> 如果在导航到页面之前需要代码逻辑，那么您需要使用 <button (click)="createBook()">Create Book</button> createBook(bookData){ // Create Book logic this.router.navigate(['/my-book-listing']); } -> 您也可以按如下方式使用，但这不是一个好习惯，除非您调用函数来销毁变量或保存页面留下的数据 <button (click)="showLoader()" [routerLink]="['/my-book-listing']">Create Book</button> showLoader(){ // showLoader logic } 如果您需要在前往路线之前发生逻辑，您可以导入路由器模块并按原样使用它。 import { Component, OnInit } from '@angular/core' import { Router } from '@angular/router'; @Component({ selector: 'app-foo', templateUrl: './foo.component.html', styleUrls: ['./foo.component.sass'] }) export class FooComponent implements OnInit{ constructor( private router: Router ) { } ngOnInit() {} action(){ // ...Your Logic... this.router.navigate([ '/bar' ]) } } <div> <button (click)='action()' >Go To Bar</button> </div> 我不确定最佳实践，但我想说，只要不干扰导航，在同一个按钮中使用 routerLink 和（单击）就可以了。 通过 this.router.navigate(['/link']); 手动导航不是最佳选择，因为 routerLink 处理诸如“在新选项卡中打开”之类的事情，而使用（单击）处理程序实现您自己的操作是不可取的。 当我只需导航到 routerLink 时，我会选择 /link 但是，如果在导航之前需要执行一些逻辑，那么我会选择click() 还有一些情况，你必须通过路由导航传入查询参数，那么我也更愿意使用click()

如何仅针对特定路由激活RouteReuseStrategy

有没有办法只针对特定路由实现RouteReuseStrategy？ 意味着每条路线都有子项，获得自己的 RouteReuseStrategy 自定义实现，并且其方法仅触发...

Angular 18 路由/URL

我目前正在探索 Angular 18，并注意到有时当应用程序路由到组件而不是主页时； 如果我刷新，它会带我返回主页，而不是重新加载

Angular PrimeNG TabMenu 在同一项目上重新加载

我想知道如何手动重新加载 PrimeNG 的活动菜单项。 我知道有办法手动重新加载当前组件，但我想知道 Pri 是否实现了任何方法...

使用 <router-outlet> 延迟加载 mat-tab 内容时，在 mat-tab 内容中，路由组件会初始化两次（构造函数和 Init）

我创建了一个 mat 选项卡组，并使用 ng-for 使用路由器出口加载选项卡，当我添加新选项卡并导航 url 时，我的新路由组件被构造两次，之前的选项卡内容被重复...

Azure 上托管的 Angular 18 应用程序的路由重定向问题

我在 Azure 上托管的 Angular 18 应用程序遇到问题。当通过 URL yyy.net（免费计划）访问应用程序时，它会正确重定向到 yyy.net/home。然而，当我...

Angular 客户端动态路由重定向到页面重新加载时的通配符路由

在角度应用程序中，我有数百条动态路线。在 API 调用后添加到路由配置中。 但是当我使用动态路由重新加载同一页面时，浏览器将请求发送到服务器并返回...

我无法路由到角度中的另一个组件

<div class="mr-3 ml-3 mt-0 mb-4 leave_card_outer" *ngIf="leaveStatus !=null"> <div class="row bg-white p-2"> <div class="col py-3 leave_card_inner" *ngFor="let status of leaveStatus | keyvalue ;index as index"> <a [routerLink]="['dstatus-fr']" class=""  (click)="setViewData(status.key)"> <h3>{{ status.key | lowercase | translate | titlecase}}</h3> <p class="mt-3 mb-0 card_text" [ngClass]="getStatuskColor(status.key)"> {{status.value}}</p> </a> </div> </div> </div> 这是我的html文件 setViewData(leaveStatus: string) { console.log("fromdate",leaveStatus,this.fromDate_YYYY_MM_DD,"todate",this.toDate_YYYY_MM_DD); } 这是我的ts文件 import { NgModule } from '@angular/core'; import { CommonModule } from '@angular/common'; import { RouterModule, Routes } from '@angular/router'; import { ChartboardFRComponent } from './chartboard-fr.component'; import { ViewstatusFrComponent } from './viewstatus-fr/viewstatus-fr.component'; const routes: Routes = [ { path: "", component: ChartboardFRComponent }, { path: "dstatus-fr", component: ViewstatusFrComponent } ]; @NgModule({ imports: [RouterModule.forChild(routes)], exports: [RouterModule] }) export class ChartboardFRRoutingModule { } 最后这是我的路由文件，其中包含各自的路由详细信息 我们需要在单击 setviewdata 时路由到 ViewstatusFrComponent 在此输入链接描述 <a [routerLink]="['/user/bob']" [queryParams]="{debug: true}" fragment="education"> link to user component </a>