Category: AngularJS

How to display a comma only in an input?

Query asked by user In the input HTML, currently, the user can enter multiple commas, I would like to reduce the number of commas by 1. I d’ont know how to make this? For example: The user cannot enter 20……01 but only 20.01 app.component.html <input notdot maxlength=”5″ [(ngModel)]=”value” /> app.component.ts export class AppComponent { value […]

close material dialog from different component angular

Query asked by user I have component A which openes material dialog component A openDialog(): void { const dialogRef = this.dialog.open(**component B**, { width: ‘1000px’, }); then I use to load image in that dialog and with button upload I upload it using component B to the server. Now when I’ve finished uploading image I […]

Angular PrimeNG Chart Module: Customize hover text

Query asked by user In the PrimeNG chart, when I hover over a data point I can see the black box with some information about the point. How can I customize this box? I want to add my own HTML for that hover infobox. P.S: PrimeNG Chart Module uses chart.js under the hood. Answer we […]

Angular ng-repeat Error “Duplicates in a repeater are not allowed.”

Query asked by user I am defining a custom filter like so: <div class=”idea item” ng-repeat=”item in items” isoatom> <div class=”section comment clearfix” ng-repeat=”comment in item.comments | range:1:2″> …. </div> </div> As you can see the ng-repeat where the filter is being used is nested within another ng-repeat The filter is defined like this: myapp.filter(‘range’, […]

Angular Change Detection On Push

Query asked by user I am trying to invoice change detection on the changing params page. After that, I get recipe JSON from DB. Why my code doesn’t invoice component change detection when I create a new Subscription in the ngOnInit? import { Component, OnInit, OnDestroy, ChangeDetectionStrategy, } from ‘@angular/core’; import { ActivatedRoute } from […]

Angular wait service subscription from component?

Query asked by user I have a problem filling a Users autocomplete on first load. This is my UsersService: public users: User[] = []; constructor(private http: HttpClient) { this.http.get<User[]>(environment.apiUrl + URLS.USERS).subscribe({ next: (res) => { this.Users = res; }, error: (err) => { console.log(err); }, }); } filterUsers(val: string) { return this.users.filter( (user) => user.name.toLowerCase().includes(val.toLowerCase()) […]

How to Sync data between two components using a service

Query asked by user I have two components that I want to sync data with. From user/product/product.component.ts To user/carts/carts.component.ts In the product component I am receiving data from firebase about the price of a product totalPrice; addToCart(item, counter, totalPrice){ this.totalPrice = this.myDocData.price * counter; this._backendService._fincartPriceSource.next(this.totalPrice); } The above function gets the price increases it as […]

Angular 13 ngbdatepicker doesn’t show dropdown of months and years

Query asked by user im working on Angular 13 project with bootstrap 4. i want to show a datePicker feild using ngbdatepicker but my datePicker does’nt show the two dropdown in the top (list of months and list of years). this is my code: <div class=”input-group flex-nowrap”> <div class=”input-group-wrapper”> <input class=”form-control” id=”date3″ ngbDatepicker #d3=”ngbDatepicker”> <label […]