Questions tagged [angular-ui-router]
UI-Router evolves the concept of an AngularJS Route into a more general concept of a State for managing complex application UI states. Most notably, it allows nested state/view hierarchies and multiple named views.
10,307
questions
0
votes
0
answers
7
views
when logging out using router.navigate throws Cannot read properties of undefined (reading 'unsubscribe')
I'm using angular 13 with typescript. I've implemented the logout & login it was working fine using
href
Now when i change it to [routerLink]="['/login']" or router.navigate it throws ...
3
votes
1
answer
42
views
Gets stuck loading a component that isn't logged in
I have a problem when redirecting when a user is not logged in. In my project I have two Guards for the Admin and User, then I use the functions of the @angular/fire/auth-guard library to redirect if ...
0
votes
0
answers
23
views
How to Pass data from one search box to another search box in same component without losing input value in angular 13
I need to show the result in second component, the first component is rendered in the second component at the same time i need the user input value to be displayed in the second component for further ...
0
votes
2
answers
27
views
Why I get this error trying to set page title?
The official documentation tells to use title property of Route to set page title. https://angular.io/guide/router#setting-the-page-title
Each page in your application should have a unique title so ...
0
votes
0
answers
14
views
Angular router-outlet chilld doesn't take all width
I have a router outlet in a component. The child component doesn't take the whole width. I tried to give to the child's div width:100%, min-width:100%, also with !important, but it's not working. How ...
1
vote
1
answer
42
views
Dynamic and lazy Routing in Angular 13
let me give you brief explanation of what I am trying to implement
In Angular project firstly login module loads after successful login I fetch the user role and user-data against that valid-user from ...
0
votes
0
answers
17
views
Get Angular Child routes from API
I want to get child routes from a database table. Can anyone please tell me how to call an api endpoint and bind the response to build child routes for a particular module.
I don't want to build the ...
-1
votes
1
answer
29
views
Angular-router not works at vercel
I'm working on the serverless web MEAN and I'm trying to publish on vercel. When I'm trying to access some route through the navigation menu, the router is working fine, but when I try to access that ...
0
votes
0
answers
11
views
How to define routes for loading previous component from the url which is having data?
Following are my routes
const routes: Routes = [
{
path: 'nav',
component:NavComponent,
children:[
{
path: 'basic-profile',
component: BasicProfileComponent
},...
0
votes
2
answers
38
views
How to check if a website is built on Angular or Angularjs?
for any website, on the browser, how to know if a website is built on Angular or Angularjs?
0
votes
0
answers
1k
views
<html ng-app="app"> convert to single-spa will make directives in the index.html disappear
I have an angular.js app where the index.html looks something like with ng-app in the <html> tag
<html lang="en" ng-app="app">
<head></head>
<body&...
1
vote
1
answer
33
views
Configure Angular Routes with Auth0s AuthGuard
I would like to configure my lazy loaded routes nested, which are only available if the users is logged in. Authentication works with Auth0s and it's corresponding AuthGuard.
So for example my routes ...
0
votes
1
answer
31
views
Angularjs different dependency injection for factories inside controller
Say I have multiple factories and these factories have same functions and variables inside. For example,
var app = angular.module('app', []);
app.factory('employerFactory', function () {
...
1
vote
0
answers
65
views
pass values from one component to another component in angular 13
I have an array of values in one component, I want to pass the data from one component to another component in angular 13.i'm new in this. Here I have a search box. I want to show the search result in ...
0
votes
0
answers
24
views
UUID npm packg is returing undefined .. I want to make id for link i try to generate id but it's retruing undefined
This is the model where I import the uuid pack
import * as uuid from "uuid";
export class Note {
id: string;
constructor(public title: string, public content: string) {
this.id = ...
0
votes
1
answer
34
views
Children routes working only when redirected
I have an interesting problem when using child routes in Angular. The route only works when there is a redirect to a "non-working" route.
In my browser if I type localhost:4200/customer/add/,...
0
votes
0
answers
30
views
Angular router state is always undefined
I m trying to pass an object with router.navigate method but when i try to read the state in the component its always undefined.
What am i doing wrong ?
navigateToLandingPage(): void {
this....
0
votes
0
answers
117
views
angular 13 search specific columns by dropdown and search input
angular 13
my task is to create dropdown and search input to filter by column, for example: if I choose firstname in dropdown I want to filter in search field by firstname and other column should be ...
0
votes
0
answers
46
views
Angular 12 + ui-router: onError not triggering redirect
I am migrating from ui-router 1 (AngularJS) to ui-router for Angular 12. In the old application we were catching transition-errors and redirecting to a proprietary 401-page via
$transitions.onError({},...
0
votes
0
answers
37
views
Scroll to top inside the mat-sidenav in Angular 12
constructor(
private router: Router,
private activatedRoute: ActivatedRoute,
private titleService: Title,
private update: SwUpdate,
private appRef: ApplicationRef
) {
//Update notification diclaration:...
1
vote
1
answer
29
views
My var does not gets updated even after changing it inside my subscription Angular, Firebase
I tried to create a canActivate method to protect my routes, for my Angular application. I want to check the status of the user,(My backend is firebase, user authentication, log in , sign up are ...
-2
votes
1
answer
39
views
How to make friendly routes in angular?
I am trying to make friendly routes in angular.
For example, I would need something like this:
example.com/my-post-title
instead of:
example.com/post/23
Thanks!
2
votes
2
answers
95
views
refreshing the page results in 401 error- Angular 8
when I hithttp://localhost:4200 or http://localhost:4200/forgotPasswordEmail on my local environment, it works correctly.
Opening the index-page on my production environment and clicking a link to go ...
0
votes
2
answers
40
views
Angular - How to point multiple routes to a single component
Hi below is my scenario.
I have two child modules with different routes
Eg route 1 :
http://localhost:4200/launch/upcoming/launchdetails
Eg route 2 :
http://localhost:4200/launchdetails
I am ...
0
votes
0
answers
16
views
get State name on direct hit page or refresh page on Angular Routing
Firstly, I tried all the questions & answers related to this topic. Additionally and I tried related questions and try to solve them but had no success. So please read my question thoroughly.
...
0
votes
0
answers
26
views
PAYTM payment integration with angular app
I am trying to embed and integrate Paytm in my angular application. I have followed all the steps mention in the Paytm docs. But somehow Paytm variable is not generate in windows event.
I have ...
0
votes
0
answers
19
views
How to view the records in table in angular without refreshing the page after updating the data
sevice.ts
public getPlans(): Observable<Plan[]> {
return this.http.get<Plan[]>(`${this.apiServerUrl}/prepaid-plan/all`);
}
public getPlanData(planId:number): Observable<Plan>{...
0
votes
1
answer
64
views
title service doesn't work in SSR when the module is lazy loaded
when you load a module normally, title service works fine in SSR, and the source code updated with the new title
// example.module.ts
let routes = [
{ path: '**', component: ExampleComponent }
]
//...
0
votes
0
answers
7
views
I am trying to use angular router with ui but the id is not passing through the url
I started to learn angular and quite possible this is a silly question but I appreciate your help
I have a component with two buttons and I try to address a new component once I click on one button ...
0
votes
2
answers
27
views
Page is not refreshing with the updated address bar link with id in angular
In my angular application I have Implemented signalR application for calls interation for members and admin. in admin page(Admin has members page with profiles)
So my requirement is when the admin ...
1
vote
1
answer
66
views
How to pass parameter to guard?
I have project-based angular 12.
I need to secure a route based on a parameter which is colled token:
export const authenticationRoutes = [
{
path: 'reset-password/token/:token',
component: ...
-1
votes
1
answer
57
views
How to refresh the page in angular with routerlink and id
I have an angular application In that I have some navigation of routerlinks
My requirement is if the user page is already open with some Id ,and if the condition satisfies in then it has to navigate ...
0
votes
2
answers
183
views
How to refresh the page in navigating from one page to other page in angular
In my angular application I have some navigation pages with router.
And my requirement is when it is navigating it has to reload the page.
.component.ts
if(ID == 0){
this.router.navigate([...
0
votes
0
answers
64
views
Angular Guard Service not working when i hit the url directly
I have implemented Routing and Guard Service in my application. When navigate by clicking by anchor tag button it is working fine. But, when I try to navigate by hitting url it is returning empty page....
0
votes
0
answers
47
views
Angular: setting paginator.pageIndex does not change the page, but If I set a breakpoint in debug mode, then it works correctly
In the beginning, I was trying to modify this.paginator.pageIndex within ngOnInit(), but it does not work for me.
I saw some answers in stackoverflow saying that I should modify the paginator in ...
0
votes
0
answers
34
views
How to get current route custom data in angular 2 after refresh the current page
const routes: Routes = [
{
path: 'new_visit',
component: NewVisitComponent,
data: {name: 'New Visit'}
}
];
0
votes
0
answers
41
views
I'm not able to display my page with the help of ion-menu and not able to click the item
ion-menu is not working
This is my sidemenu.component.html
<ion-split-pane contentId="menu-content" when="xs">
<ion-menu contentId="menu-content" &...
0
votes
0
answers
84
views
NavigationStart Event is not Firing/Triggering on refresh
I have a component that has router events like NavigationStart & NavigationEnd. While they work perfectly on visiting a new route but I am facing an issue with NavigationStart event which does not ...
0
votes
0
answers
66
views
Why is my Angular component loadable within a module where the component is not declared and that does not import the module where it is declared?
I have two modules (AppModule and SomeModule) and one component (SomeComponent).
SomeComponent is declared inside SomeModule :
@NgModule({
declarations: [SomeComponent, SomeOtherComponent],
})
...
0
votes
0
answers
17
views
Angular page not loading from top after navigation angular material
I am using angular material, I am scrolling page to middle and navigating from one component to another one but after navigation page not loading from top it is showing in middle. Could any help. ...
0
votes
0
answers
38
views
On login application always redirect to undefined route in Angular
I am using a SSO for login and logout process in my application.
It works fine if user logged in first time in application, however if I logged into application from 2 tabs of a browser and press ...
0
votes
1
answer
88
views
How can We create dynamic route navigation Link in angular with multi level children and which will recreate whole navigation on reload
I wanted to create a navigation list based on some configuration.
like an Array of
export interface LeftNavModel {
name: string,
route: string,
iconName?: string,
data?: any }
so navigation data will ...
1
vote
0
answers
95
views
How to make React useParams (router) work with Angular router in a micro-frontend project?
We have an Angular 1.0 project. A separate new React project repo was created and then imported into Angular via single-spa. Single-spa keeps throwing 227 status errors and we can't fix that. So ...
1
vote
1
answer
43
views
Router does not navigate to targeted component
I have a function that redirects a user to a page Orders if the user's state is complete, and to a HOME page if the user's state is not complete.
The Orders page has a GuardService that implements ...
0
votes
1
answer
295
views
How to build a url with array of query parameters using http get request
I am trying to pass multiple values that I have selected in Supplier component and display the detail information in Supplier detail component.
I have to execute the query like below with selected ...
0
votes
1
answer
80
views
How to update this.router.url property based on some condition in Angular
I am working on angular application where I want to update router url on some condition. below is the sample code:-
console.log(this.router.url) // it prints '/users'
this.location.replaceState('/...
0
votes
2
answers
95
views
Subscribe to changes to a part of the router URL
Say I have a link localhost:4200/details/1
I want to subscribe only to changes in the "details" part of the URL. i.e. when "details" changes to some other word and not the other ...
0
votes
0
answers
18
views
Query Params not passing to next component after first Load of Component
I have stuck into a very tricky problem related to Query Params passing to the next component in Angular.
When I am trying to send the query params after the first load by clicking on the button the ...
0
votes
0
answers
41
views
Angular 2+ - UI-Router otherwise redirects on local anchors links
I have defined a fallback route for ui-router to use when it cannot identify the route the user is trying to access, using the otherwise param:
@NgModule({
imports: [
UIRouterModule....
0
votes
0
answers
19
views
Application not mounting in angularjs after upgrade from 1.2.32 to 1.8.2
I upgraded application from 1.2.32 to 1.8.2.
but landing page is braking.
No views there to render.
Code failing on very first hit.