307,045 questions
1
vote
1
answer
8
views
Custom directive and [ngClass] on same element does not work
I have a custom Directive which puts a class when the mouse hovers an element :
@Directive({
selector: '[hover-class]'
})
export class HoverClassDirective {
@Input('hover-class') hoverClass: ...
1
vote
2
answers
19
views
Guard flickers page then loads actual page
export const authorizedUserGuard: CanActivateFn = (route, state) => {
console.log('guard call', route, state)
const tokenService = inject(TokenStorageService);
const router = inject(...
- 71
0
votes
0
answers
7
views
CKEditor 5: Pasted content from WPS Office not visible (text formatting is applied but no text displayed)
I’m facing an issue with CKEditor 5 where content pasted from WPS Office is not visible in the editor. The text is getting pasted, and formatting is applied correctly (e.g., bold, italic), but the ...
0
votes
0
answers
8
views
Google Docs Viewer and Office Online Not Displaying Document on S3 Presigned URL in ngx-doc-viewer
I'm trying to use ngx-doc-viewer to display documents stored in Amazon S3 using presigned URLs, but I keep running into issues when trying to preview them via Google Docs Viewer and Office Online.
...
- 29
0
votes
0
answers
9
views
Page content not displayed after deployment on mobile
I’m developing an app called SubTrack using Angular and Capacitor, with Firebase used solely for data storage. Everything works perfectly in local development using ng serve, I am facing an issue ...
- 1
0
votes
0
answers
59
views
Programmatically import a CSS file by its relative file path
Background
I'm hosting legacy React components in an Angular app using a method similar to this one. There are lots of React components to bring in. They all import their own CSS with JS module ...
- 30.7k
1
vote
1
answer
20
views
Angular PrimeNg singleton services ( Confirm , Message) show twice in view
i have an Angular V19.0 application , there is an issue with primeNg toast and confirm services. i have provided the services in a core module which is imported in app.module.ts
but when ever i inject ...
- 69
0
votes
1
answer
22
views
mat-table header content not updating even when underlying data is changed
I am using angular material(ver 16) to render a table, but I am unable to update the table header even though the data that has been bound has been updated.
Here is what my component looks like:
...
- 2,463
1
vote
1
answer
27
views
Angular material responsive layout from columns into tabs
I would like to have a responsive design for my angular application using angular material.
My page should have 3 columns on desktop that should be grouped into 3 tabs when on mobile.
I was able to do ...
- 372
1
vote
1
answer
23
views
How to create a component with sub elements in Angular [duplicate]
I try to create an own component in Angular 19 that works similar to the MatCard. There, I can define a template like:
<mat-card appearance="outlined">
<mat-card-header&...
- 1,249
0
votes
0
answers
18
views
How to resolve ERR_NAME_NOT_RESOLVED afer Angular upgrade to version 18
I'm working on a Java 17 web app with Angular 13 front end. Java is running in Docker. I've managed to migrate Angular to version 17 without problems, but after upgrading to version 18 and resolving ...
0
votes
0
answers
9
views
Angular Calendar (mwl-calendar) scrolls indefinitely on touch devices after dragging an event
I am using Angular Calendar (mwl-calendar) in my project. On touch devices, I am encountering the following issue:
When I drag an event and it triggers auto-scroll, the auto-scroll does not stop even ...
- 1
1
vote
1
answer
11
views
Required to dynamically call to Change() event on page load in Angular 8.3.21 and ng-select
I'm unable to call the change() event when the page gets loaded.
I would like to display 'NONE' as a default text in ng-select drop-down untill api data gets loaded; thus, the 'NONE' value will be ...
- 11
1
vote
1
answer
16
views
Can i modify Ngx-Mask Special characters?
i have an input with ngx-mask with the 0|0|0|0|0|0 and my special character is "|" but isn't large enough in the UI (images on the bottom). There is any option to only make larger the | ...
- 21
-1
votes
0
answers
36
views
Preventing clickjacking vulnerability from client side
What other options do I have to prevent clickjacking, I am looking for possible solutions that can work on the codebase not server side.
I am working on an angular project and have tried these,
...
- 89
-1
votes
1
answer
39
views
Angular mat-chip, use space and tab to enter a new input
Actually, in a mat-chip, we need to press Enter to be able to add a new element in the list.
I'd like to have the space, comma and tab to have the same effect.
How would this be doable?
Here's the ...
- 8,441
1
vote
0
answers
21
views
Story book angular inject a service
Trying to inject a service in to story book angular.
To call a method in angular service.
render: () => ({ props: { uType: 'secondary',
withDelay: (injector: Injector) => { const ...
1
vote
0
answers
41
views
what's wrong with my code No value accessor for form control with name: 'piscina'
Template
<div style="margin-right:10px"><p-inputSwitch [(ngModel)]="parametrosPesquisa.piscina"
name="piscina"></p-inputSwitch></div>
Code
...
- 2,669
1
vote
1
answer
28
views
viewChild query returns Signal<ElementRef> instead of Signal<Element>
I'm using viewChild to get reference to some element, I expect the signal to return a reference to the element but it seems to return the old syntax {nativeElement: Element} instead
Package: @angular/...
- 38
1
vote
1
answer
45
views
How to resolve The _AppComponent component is not marked as standalone, but Angular expects to have a standalone component here
I was migrating from standalone component to module based where I changed and even tried to remove standalone in the decorator in the appcomponent, and in main.ts file I imported platformdynamic and ...
- 21
0
votes
1
answer
22
views
angular springboot login JWT
after login i stored token and userRole in localStorage..i tried to inject a random token(without login) in localStorage via navigator and then, i can get access to restricted page...
i want to ...
-2
votes
0
answers
25
views
How to avoid PWA updates during user input
I am currently working on an angular 19 project which is determined to be a pwa for the customer. Now I have the requirement to avoid a version update in angular if the user is entering something in ...
- 169
0
votes
1
answer
25
views
The most optimized way to bind variables in Angular when dealing with objects
I read the manual of binding object properties in Angular, however I struggle to find the perfect most optimized solution.
Let's say i have a model User
export class User {
public _id: number;
...
- 21
1
vote
1
answer
30
views
Failed to resolve dynamic import
So I migrated from version 17 to 19, and now the dynamic imports don't work on ng build.
This import
import('@fingerprintjs/fingerprintjs/dist/fp.esm.js')
results in:
TypeError: Failed to resolve ...
- 274
0
votes
0
answers
39
views
Problem aligning items into NgbAccordion's header
hello i have the following situation:
an angular 18 accordion from library NgB and bootstrap 5.3 library imported.
i would styling the header as follow:
the "button alarm " and the "...
0
votes
0
answers
34
views
Ngx-Pagination not navigating and got disabled
Using Angular, I am consuming an API from ASP.NET Core Web API, I have this endpoint that performs Query Filter, ngx-Pagination, ngx-datepicker, and Sorting.
It can perform
Search Query,
Search Query ...
- 1,573
0
votes
0
answers
23
views
Child to parent data passing is not working if i refresh the page it is working fine? [closed]
I have two components parent and child. parent component shows listing of some items and child component has filters. so once filters we apply, one API call will go and some data will come and that ...
- 11
0
votes
0
answers
23
views
MsalInterceptor is not setting the bearer token to the http requests made from the img, video, audio and pdf viewer control
I am developing an angular application in which I have integrated EntraID app for authentication and used the MsalInterceptor and configured the required providers as follows:
providers: [
{
...
- 141
0
votes
1
answer
42
views
Having issues with option selection when using @if
I'm trying to implement an autocomplete search in Angular 17 using the new control flow syntax and Material's mat-autocomplete. I want to only show options when there's a search value, but I'm running ...
0
votes
1
answer
22
views
How to securely manage secrets in Angular, Firebase, GitLab CI/CD?
I am working on an Angular application deployed on Firebase Hosting. I want to keep my sensitive API keys and tokens secure without exposing them in environment.ts, environment.prod.ts, etc files. I ...
1
vote
1
answer
41
views
Strange behavior using Angular elements with application builder v19
I created a demo app using the @angular/elements package (v19) to build an mfe-1 app as a web component, which is then displayed inside another app called shell. Both apps are set up with the Angular ...
- 2,970
1
vote
1
answer
24
views
PrimeNG Editor with inline styles instead of quill classes
I am wanting to use PrimeNG Editor and then display it as innerHTML in my angular app or another web app.
The problem is PrimeNG Editor, or more specifically Quill, uses classes as styling.
So my ...
0
votes
0
answers
16
views
How to serve the default locale without it being visible in the browser address bar in an Angular 15 application deployed on Cloudflare Pages?
I have an Angular 15 application using an Angular localization package. The application is deployed on Cloudflare Pages with the domain example-domain.com. Currently, it works fine for locales such as:...
0
votes
0
answers
26
views
Bypass Keycloak login page to access Keycloak UI with existing token
In our Angular web app, we use Keycloak APIs for auth and managing user-related operations. We're now facing a challenge: we need to embed the Keycloak UI within an iframe in our application allowing ...
- 720
1
vote
1
answer
27
views
Capacitor / @googlemaps/js-api-loader: Can't import library via loader
I am building an Angular + Capacitor app and want to use the Google Places API along with the Geocoding API. I have configured the API key in the Cloud Console (with no restrictions on the key) and am ...
0
votes
0
answers
13
views
Manually mat-multi-sorting using ngx-mat-multi-sort
Need to set manually columns and directions I had tried but below code is not working properly still sorting directions are not getting set so can any one suggest ?
public table: TableData<any> =...
- 1
1
vote
1
answer
36
views
Angular Material 19 styling
I am trying to style a form field from angular material 19 using form-field-overrides mixin (https://material.angular.io/components/form-field/styling), but no tokens seem to work.
Note that I used ...
- 21
1
vote
1
answer
33
views
Catch error thrown from http.get() thats piped [duplicate]
I have the following code inside my auth service:
return this.http
.get<any>(`${environment().apiUrl}/auth/refresh`, {
headers: { Authorization: `Bearer ${this.userValue?....
- 685
0
votes
1
answer
32
views
After updating to Angular 18 and migrating to the new builder there is an empty chunk file
We have migrated to Angular 18 and want to use the new builder @angular/build:application as it is recommended.
When we build the app it however produced one empty chunk file. This file was imported ...
- 466
1
vote
1
answer
33
views
Why DI RouterState in standalone app triggers NullInjectorError
I am getting NullInjectorError error in brand new angular app.
I have just generated this app as a standalone angular app (ng new StandaloneApp). In the AppComponent's constructor I have added ...
- 489
1
vote
0
answers
19
views
is using computed to access the router out let view child make error?
i am trying to access router outlet using viewchild and then access the projected component and based on it access some values from it. when i used effect to do so it worked, but i thought using ...
1
vote
1
answer
27
views
ion datetime component persist value across different components
i have a very strange problem where i am using ion-datetime component on component inside a model component. From this component, I call another component in a model that also has an ion-datetime ...
- 1,318
1
vote
1
answer
32
views
Error: Object literal may only specify known properties, and 'use_fedcm' does not exist
Problem
We're migrating our app from Google Sign-in JavaScript library (AKA gapi) to FedCM. In the email Google sent last week about migrating to FedCM, they link to steps to test your existing ...
- 14.3k
4
votes
2
answers
43
views
New subscriptions always returning intial value instead of current value [duplicate]
I have a relatively simple Angular app using services to pass values between my components. The problem I am running into is when I go to a new route and load a component, subscribe to a service, it ...
- 1,459
2
votes
1
answer
34
views
How to use root store in a standalone Component?
I'm working on a project using the old NgModules architecture and I'm transitioning into the new standalone components gradually. I'm stuck right now on how to provide the root store to the standalone ...
- 2,079
0
votes
1
answer
39
views
Jest unit test in Angular app is throwing "Jest encountered an unexpected token" error
I'm receiving email messages from a local mail server and I need to be able to parse them in JavaScript. The @ProtonMail/jsmimeparser library is working flawlessly which is a huge relief. However, it'...
- 5,619
0
votes
0
answers
19
views
You provided an invalid object where a stream was expected. You can provide an Observable, Promise, ReadableStream, Array, AsyncIterable, or Iterable
I am trying to test the following code, but it seems that there is some dependency missing, something similar to rxjs, if anyone can identify I will be grateful
Test
let paginatorMock: jest.Mocked&...
- 23
-1
votes
0
answers
34
views
Angular 19 and Vite throwing error about named export 'injectQuery'
We are trying to update to angular 19. The app builds and units run fine. But when trying to open app in the browser we are faced with the following:
Uncaught SyntaxError: The requested module '/@vite/...
- 959
1
vote
0
answers
35
views
Angular router-outlet directive doesnt work twice
i have a litte problem. My router-outlet tag in app.component.html works fine for the first time. If i need to navigate back to this component or click "back" in the browser, it is simply ...
- 25
1
vote
1
answer
44
views
Angular Zoneless detect external code changes
I am using a global error handler and a Graphql provider that handles all requests and errors.
However, when throwing an error, it is not caught by the global handler as it is outside it's angular. ...
- 367