Questions tagged [angular13]
For questions regarding programming in Angular specific to version 13. Please include all relevant tags on your question; e.g., [Angular], [TypeScript], etc.
432
questions
0
votes
2
answers
23
views
Javascript code number likes by typescript / angular
I have some javascript code which I'm trying to add to my component.ts in my angular project.
Here is the code:
ngOninit() {
let areaNum = document.getElementsByClassName("some-area")....
0
votes
1
answer
22
views
angular 13 component does not show after clicking navigation button again
The scenario:
I have a navigation component that navigates to either one of two components depending on which link is clicked. For the writeup component i display a gridlist with cards initially. When ...
0
votes
2
answers
24
views
Angular 13 Material Datepicker does not apply styles properly
I've been trying to learn how to use angular 13 datepicker and I can't understand what is not working properly.
Here is my main module.
import { BrowserAnimationsModule } from '@angular/platform-...
0
votes
0
answers
23
views
Performing multiple async tasks before browser close in Angular
Am trying to complete two asynchronous tasks before closing the browser in Angular13.
tried with async/await but the promise doesn't seem to be resolving , instead browser is getting closed . Tried to ...
0
votes
0
answers
17
views
require is not defined error when using require and Cannot use import statement outside a module when using import in javascript in Angular 13
I am using Angular version - 13.1.2.
I tried using 3rd party nuget for Pulsar JavaScript Client https://www.npmjs.com/package/pulsar-ws
In code, when I try to use require in Javascript file I created, ...
1
vote
2
answers
22
views
How to change routerLink in angular and type script
I have some menus in the header. Now I want to add query string parameters to all header menus programmatically. My code is like this.
<nav class="menu-links">
<ul class="...
0
votes
1
answer
41
views
How dynamic create component inside clicked table cell
some.component.html
<table>
<tr *ngfor="let row in table">
<td *ngFor="let cell in row" (click)="onCellClick($event)">Cell Text</td>
</...
-1
votes
0
answers
40
views
Facing issue while implementing lazy-loading on angular 13 application
I am working in angular 13 and have a requirement to lazy load modules. I have done it but still its not working.
app-routing.module.ts
import { NgModule } from '@angular/core';
import { RouterModule, ...
0
votes
0
answers
23
views
Angular 13 SSR Build Serve eror -- ERROR ReferenceError: document is not defined
var canvasElement = document.createElement('canvas');
^
ReferenceError: document is not defined
at C:\Users\aakas\Desktop\ArteryUniversal\dist\Universal\server\main.js:64680:25
at ...
0
votes
0
answers
37
views
ERESOLVE unable to resolve dependency tree while installing ngx-toastr on angular 13
Getting below error while trying to install ngx-toastr on my angular 13
npm ERR! code ERESOLVE
npm ERR! ERESOLVE unable to resolve dependency tree
npm ERR!
npm ERR! While resolving: p4-...
-1
votes
0
answers
13
views
Laravel MySQL Chat Application database structure and retrieve data
I need data retrieve for recent private chat and group chat
like WhatsApp chat history
below attached my db structure
Database structure I have used two different database users one table messaging ...
0
votes
0
answers
34
views
Angular: Same dynamic component to used on each collapse of the table
Here is my dynamic collapse HTML table shown below.
<table width="100%" border="0" cellspacing="0" cellpadding="0" class="table table-bordered bg-white&...
-2
votes
0
answers
38
views
Can't access to the backend of the site Angular 13 & SpringBoot [closed]
Can someone help me please,
I am trying to develop project using Angular 13 as frontend and spring boot backend. I have a problem in CORS policy and I have no access to the backend of the site
Once ...
0
votes
0
answers
17
views
authentication with google in firebase alone users created Angular [duplicate]
"How can I do so that the authentication with google by firebase is only for already created users? Not create user"
I need the already registered user to log in with google. do not create ...
-1
votes
0
answers
55
views
How to fix CORS error when making POST request from Angular 13 app to c# webservice
I am very new to Angular and am having trouble building a simple app. I have created a form and have written some code to populate the fields with values from a webservice, called using a Get method. ...
0
votes
0
answers
25
views
Cannot start Angular 13 application running under IIS using SystemJS
We have a Visual Studio Web project which is a MVC application. Html is rendered using Razor and injects an Angular application. When running from Visual Studio, the application is hosted in IIS ...
0
votes
0
answers
22
views
Module build failed: Thread Loader (Worker 0) Migrate to Angular 13
I am getting error after migrate to Angular13
0
votes
0
answers
38
views
swimlane/ngx-datatable having performance issue with Angular 13
I Updated my app to from angular 12 to 13, during the upgrade process I added below overrides in package.json as 6.6.7 version of rxjs was throwing error in Angular 13
"overrides": {
&...
0
votes
0
answers
33
views
How to change SlickGrid width on *ngIF
I am trying to change width of slick grid when mat-sidenav is closed. I have created a boolean as sideNav in service, and trying to use that boolean in *ngIf of , but it's showing this error.
...
-2
votes
0
answers
16
views
How to handle authorization redirection CORS error in angular side
I have spring-boot app with spring security implemented, for the front end I am using angular 13. I have a secure end point in the backend which I am using for getting the details of user. While ...
0
votes
0
answers
11
views
How do I adjust bootstrap Columns when error occurs, it moves the next column UP when ERROR goes away
I have the following code situation
HTML:
<div class="form-group datesactiveservice">
<h3>{{enumProps.ACTIVESVCDATES}}</...
0
votes
0
answers
55
views
+50
Getting error while exicuting angular universal app
I am working angular 13 application and trying to integrate universal.
I have followed the official document https://angular.io/guide/universal to integrate.
Angular version
Angular CLI: 13.3.8
Node: ...
0
votes
0
answers
10
views
MatSnackBar default action label
In order to not always specify the same options when opening a snackbar, I am looking into possible ways to provide default values. For the duration I already found a way to specify a default value ...
1
vote
2
answers
45
views
Angular Can Deactivate - Material Dropdown
I have an implementation of Angular RouteGuard CanDeactivate. It works for input fields but its not working for drop downs. I also want to display my own modal and I can't get it work correctly.
This ...
0
votes
0
answers
10
views
Add a column with different colors in each cell of p-datatable
How can I create a p-datatable that has a column where each cell is colored?
I understand this is achievable if each and are static.
But the solution I'd like to create is one where the columns are ...
0
votes
0
answers
12
views
After migrating to Angular 13, ng build and ng build --prod renders blank page
ng serve works perfectly fine.
But ng build & ng build --configuration=production renders blank page without any errors in console.
-1
votes
2
answers
29
views
Is there anyway to show a card/container/div on top of hovered stepper in Angular?
I want to create a tools card to manage steps and show it on top when the mouse is hovered on step like the picture below :
Is there any way to do it ?
0
votes
1
answer
18
views
How to load file after being uploaded (not saved in database yet) in angular, html
I have a file upload control in my angular app where user could upload any type of file except a few ones .exe, .sql etc
<input type="file" id="file" #file (change)="...
0
votes
1
answer
26
views
side menu item with [routerLink] results to navigating to the default route after double clicking
I'm resolving some bug on the side menu on an Angular application, when I click on the side menu item twice I'm always redirected to the default route. As shown from the screenshot below when I click ...
0
votes
4
answers
44
views
How to show div depending on the selected checkbox value in angular
Trying to show div depends on the selected checkbox values. But not working. If i check bus 12 from the checkbox i want to show bus1 and bus2. Suppose if i uncheck bus 12 i want to hide bus1 and bus2....
0
votes
0
answers
20
views
How to fix material angular css issue
In my application material, angular CSS is not loaded properly. I have installed the required module but, I do not know why it is not loading the material CSS in stackblitz. If anyone knows please ...
0
votes
1
answer
15
views
How to perform Patch
I have a login form, which I have implemented using reactive forms. I have created a static table also, once the login form is filled and clicked the save button, all the values will be populated in ...
0
votes
0
answers
4
views
How to give even color to the table row and same color to the next row which is added after button click
I have one table ,I'm adding even odd color to the table rows. Each row have score button when I click on score button row should be expand.
I'm not using angular material table.
0
votes
1
answer
26
views
How to access function in the same typescript file from another export function in angular
I am trying to access a function from another export function in the same ts file. But not working. So, How to do it?
app.component.ts:
import { Component } from '@angular/core';
@Component({
...
0
votes
0
answers
19
views
Angular [hidden] attribute stopped working in 13.3.8 update
I updated angular to version 13.3.8 in my project and the [hidden] attribute stopped working.
This is part of my code where it stopped working:
<ng-container matColumnDef="noData">
<mat-...
0
votes
1
answer
31
views
encoding decoding Json using RSA Angular and Express.js
I have a frontend Angular.ts and a backend Express.js. I am decrypting user credentials in the frontend using RSA and sending all the data as an encrypted string to the backend.
When I try to catch ...
1
vote
0
answers
14
views
kendoTooltip Issue with Angular mobile version
i'm having an issue with kendotooltip component inside my angular application, it's working for desktop version but not for mobile version(although i added onshow="click" event and still not ...
0
votes
0
answers
31
views
How can I properly configure nginx to work with Angular with using hot reload?
I run my server app with command: ng serve and get error in browser console:
Firefox cannot connect to the wss://dev.domain.com/ws server.
[webpack-dev-server] Trying to reconnect...
or on chrome:
...
1
vote
0
answers
39
views
Write callback function for create custom tooltip content using ng2-charts in angular 13
I want to write a callback function for modifying tooltip's title & label content on bubble chart generated using ng2-charts. I already followed hint from Custom Tooltip for ng2-charts & ...
0
votes
0
answers
31
views
How to launch a modal on page reload with @HostListener('window:beforeunload', ['$event']) in angular 13?
I am trying to launch a modal when reloading the page, however it appears once I hit cancel in the chrome event, how can I make it launch without the chrome event?
This is my code:
@HostListener('...
1
vote
1
answer
60
views
How to override Provider in Angular 13 for angular testing Jasmine Karma?
So i've looked at many issues online related override Provider but not getting success.
Showing in this code i have already working in angular version 7 this test case working fine.When i upgrade to ...
0
votes
1
answer
36
views
Angular 13 window.ng.ɵcompilerFacade is replaced whenever new scripts are loaded
Update:
I noticed that whenever we try to load a component/module it looks for window.ng.ɵcompilerFacade and expects it to be in v13 complaint format. But in between, if I load any web-component(built ...
0
votes
0
answers
36
views
Error: Module not found: Error: Can't resolve 'signature_pad' when it's been working for the past 3 weeks
I'm getting this error now after deleting node_modules and doing a fresh npm install
$ ng build
Your global Angular CLI version (14.1.0-next.0) is greater than your local version (13.3.7). The local ...
0
votes
1
answer
39
views
How do I get past No Session error in authentication process with Laravel 9/Angular 13 SPA?
I have my Angular 13 SPA authenticating to Laravel 9 (Sanctum). I'm able to get the CSRF cookie and perform the auth step, which is successful, but when I attempt to hit any other protected API ...
0
votes
1
answer
35
views
Angular project doesn't know click, button, ngIf/ngFor
I use angular v13 and node js v12.22 in my project. This problem suddenly come, I just close several hour and open it again after that I found this similar errors in all components. My project doesn't ...
0
votes
1
answer
59
views
ERROR TypeError: Cannot call a class as a function
I am using angular 13 and while building the app build is successful but when loading the app I am getting can not call class as a function, I am not able to figure out how to fix this can anyone help
...
0
votes
0
answers
14
views
Jasmine 4 ANgular 13 CryptoBrowserify publicEncrypt Error spyOn> : publicEncrypt is not declared writable or has no setter
publicEncrypt is not declared writable or has no setter
beforeEach(fakeAsync(() => {
spyOn(CryptoBrowserify, 'publicEncrypt').and.returnValue(Buffer.from('ENCRYPT', 'utf8'));
...
1
vote
1
answer
18
views
How do you align three columns with date range so they are all next to each other using BOOTSTRAP/Angular 13
I'm using this Bootstrap date range where the TWO DIVS are next to each other
What I need to do is show THREE DATE RANGES in three divs on one ROW.
This is what I want to do
<div class="input-...
2
votes
0
answers
41
views
use require() in .mjs bundles - Angular 13
I recently upgraded my project to Angular 13, I noticed that the new ng-packgr 13 bundles in .mjs extension by default. I have lots of code that uses require() to import some static assets and files. ...
-1
votes
0
answers
25
views
How can we create a text switching animation with angular 13
How can we create a text changing animation like the spring.io website with Angular 13.
Here is the animation as desired