Issue I want to call an ng-template from within a ngFor using an ng-container My list is an array and has a list of objects. one property of an object is title – seen in the ng-template. Html: <ul> <li
Continue readingTag: angular5
Getting [Object Object] in angular application
Issue Getting [Object Object] in angular form and also dropdown(select) not set to default 0 index. While in case of edit everything working fine. Do I need to initialize model properties for this create page? Edit : ngModelChange not calling
Continue readingAngular 5: nested form control within form group within form array
Issue I’m having trouble referring to a formControlName within a formGroup within a formArray. The structure of my formGroup within my formArray is as follows: const marketingFileFormGroup = this.fb.group({ file: [], fileName: [], fileType: [], fileUrl: [], createdBy: [], createdAt:
Continue readingAngular 5: Dynamic Form Validation inside a table
Issue I am trying to validate input fields inside a table using form group but unable to achieve the same. I am using *ngFor to iterate the data because I have to display that data in the first column of
Continue readingHow to show component selector on click event Angular5
Issue I am getting issue while display another component on click event, here is my code: <div (click)=”showThis = true”></div> <div class=”” [ngClass]=”{‘hide’: showThis}”></div> <div class=”” [ngClass]=”{‘show’: showThis}”> <another-screen></another-screen> </div> its displaying both, first should display without any click, if
Continue readingHow to retrieve data from ngx-modal on submit angular 5
Issue I am using ngx-modal to create dialog, below is the code in html <button (click)=”myModal.open()”>Click Me</button> <modal #myModal cancelButtonLabel=”Cancel All [(ngModel)]=”rfin” submitButtonLabel=”submit” (onSubmit)=”callSubmit()”> <modal-content > <mat-card> <mat-card-content > <h2 class=”example-h2″>Select Emp</h2><br> <section class=”example-section” *ngFor=”let ep of emp” > <ng-template>
Continue readingGet reference to injector inside Angular 2.X custom module?
Issue How we can get a reference to dependency injector inside the application module ? Here is the example code of the custom module. So how we can get reference to Angular DI (Dependency Injector) inside this class ? @NgModule({
Continue readingAngular5 – How to detect empty or deleted field in mat-autocomplete?
Issue This is my html which contains the material autocomplete. <ng-container *ngSwitchCase=”‘autocomplete'”> <div [ngClass]=”(filter.cssClass || ‘col-md-4’) + ‘ mt-2 pt-1′”> <div class=”filter-key-label”> {{filter.columnTitle}} </div> <div class=”filter-form-control d-flex flex-wrap justify-content-left”> <mat-form-field class=”full-width”> <input type=”text” matInput [formControl]=”myControl” [matAutocomplete]=”auto” ng-model=”blah”> <mat-autocomplete #auto=”matAutocomplete”> <mat-option
Continue readingAngular5 – @HostBinding instead of :host
Issue I read that its better to use @HostBinding instead of :host. So i think about change my component.ts @Component({ host: { ‘class’: ‘cover’, ‘[class.uploading]’: ‘uploadProgress > 0’, } }) This works fine, but when i change it to: export
Continue readingError Angular 5 + NGX_Restangular + Webpack-dev-server
Issue Using Angular 5 + NGX_Restangular + Webpack-dev-server Angular 5 “ngx-restangular”: “2.2.3” “webpack”: “4.5.0”, “webpack-dev-server”: “3.1.3” Success building application and starting web server = ng serve Failure running application on web server using webpack after running ng eject npm start
Continue readingUncaught Error: Template parse errors: "let-" is only supported on ng-template elements.
Issue I am migrating my angular-cli project from Angular-4 to Angular-5, but faced this error, anybody knows any solution to fix this error? Uncaught Error: Template parse errors: “let-” is only supported on ng-template elements. (” <template #tourStep [ERROR ->]let-step=”step”>
Continue readingActivatedRoute in Angular 5 not delivering URL parameters. Ideas?
Issue I have implemented ActivatedRoute on my app.component.ts page. This is the page where I have a big, red exit button on, and it appears on all pages of my app as intended. I jump into the url I’ve created
Continue readingDynamic object key to display *ngFor in Nativescript with Angular
Issue I have the dataset which has derived from the group by product name as below. I need to iterate the array of object and display the product name with all the size of the product. Sample dataset [ {
Continue readingCircular dependency error in angular 5
Issue Always I’m getting warning that is circular dependency WARNING in Circular dependency detected: src\app\auth\logout\logout.component.ts -> src\app\auth\_services\authentication.service.ts -> src\app\app.module.ts -> src\app\app-routing.module.ts -> src\app\auth\logout\logout.component.ts WARNING in Circular dependency detected: src\app\theme\layouts\header-nav\header-nav.component.ts -> src\app\_services\data\emp.service.ts -> src\app\app.module.ts -> src\app\theme\layouts\layout.module.ts -> src\app\theme\layouts\header-nav\header-nav.component.ts WARNING in Circular
Continue readingAngular 5 – End to End testing with ngModel
Issue in last week we are trying to add e2e testing to our project, but it seems (after a big research in the web) there is no library that can work with Angular ngModel (version 2+). what can we do
Continue readingangular4 kendo-numerictextbox ngModel two way data binding
Issue Below one is just sample. I need to multiple calculations dynamically. Total value is not updating if I change values in units/price text boxes. How can I calculate using ngModel? Should we use valueChange event? Angular 4 don’t update
Continue reading(Editing Angular 5) I can't get the values of the object that is in NgModel
Issue I could not get the object of this field component.html <div class=”form-group”> <input type=”number” name=”totalPrice” class=”form-control” #lastname=”ngModel”[(ngModel)]=”invoiceService.selectedInvoice.totalPrice” readonly> </div> <!– working ok –> <div class=”form-group”> <input type=”number” name=”purchases” class=”form-control” #purchases=”ngModel” [(ngModel)]=”invoiceService.selectedInvoice.purchases[‘product’]” readonly> </div><!– not working –> this the element
Continue readingAngular 5 – Find objects in array and create new array with those objects found
Issue I have the following array with objects. Im trying to find the object with type “noActiveServiceDashboard” and type “extraAmountDashboard” and create a new array of objects in the same format with only these two entries. Ive tried using .find()
Continue readingHow to check for undefined before assigning to variable
Issue Im using a find method to extract an ID (string) but this is returning an undefined as it doesnt exist. const additionalLinePhoneNumber = products.find(product => product.name === ‘segundaLinea’).id; Products has the following: (2) [ProductInventoryList, ProductInventoryList] 0: ProductInventoryList {_id: "12345",
Continue readingRequestOptions deprecated symbol error in Angular 5
Issue I’m trying to adapt code in Angular 4 to Angular 5. I made many changes but I had an error about RequestOptions. The code is about authentication and this is where I have the error: import { Injectable }
Continue readingHow can I make dynamic url to external site in angular5?
Issue When I’m trying to make link like this: <a [href]=”getUrl()”>click me</a> getUrl() { return this.domSanitizer.bypassSecurityTrustUrl(‘http://sampleUrl.com’); } It’s not clickable. When I hover over link, I can see that url is there but click event isn’t, I think. There is
Continue readingHow can I make dynamic url to external site in angular5?
Issue When I’m trying to make link like this: <a [href]=”getUrl()”>click me</a> getUrl() { return this.domSanitizer.bypassSecurityTrustUrl(‘http://sampleUrl.com’); } It’s not clickable. When I hover over link, I can see that url is there but click event isn’t, I think. There is
Continue readingHow can I make dynamic url to external site in angular5?
Issue When I’m trying to make link like this: <a [href]=”getUrl()”>click me</a> getUrl() { return this.domSanitizer.bypassSecurityTrustUrl(‘http://sampleUrl.com’); } It’s not clickable. When I hover over link, I can see that url is there but click event isn’t, I think. There is
Continue readingjson 2 typescript mapping gives type error
Issue Okej so Im trying to map a list of .Net objects to my Angular frontend by way of Web Api 2. The objects are sent, I get them, but depending on the circumstances the objects and their properties might
Continue readingError while trying upload a file with kendo-upload and Angular 5
Issue I’m trying to upload a file (image) to a remote server with Upload Component of Kendo UI for Angular. avatar.component.html <kendo-upload [saveUrl]=”uploadSaveUrl” ></kendo-upload> avatar.component.ts uploadSaveUrl = ‘http://localhost:9001/common/file/saveAvatar’; error from browser console ERROR TypeError: Cannot read property ‘type’ of undefined
Continue readingTimezone for date not working in Date pipe – angular 5
Issue I am fetching data from date column in my DB. I try to format it with the timezone using the date pipe. Below is the code <ng-container matColumnDef=”invoiceDate”> <mat-header-cell *matHeaderCellDef mat-sort-header> Date </mat-header-cell> <mat-cell *matCellDef=”let invoice”> {{invoice.invoiceDate | date:
Continue readinginterceptors in angular 5
Issue I create interceptors in project angular 5 but dosen’t work, i inject interceptor in file app.module.ts but also error and also i add console.log in interceptors for test but console.log not displayed code interceptors: import { Injectable } from
Continue readingProblems getting the ID and redirecting the page to product-details
Issue I’m trying to redirect from the list of products to a product-details page, but my URL is duplicating some parts and getting a wrong Id. example: /cafe-c3c52.firebaseapp.com/admin/products/ when I click on button edit, the URL changes to /cafe-c3c52.firebaseapp.com/admin/products/%5B/admin/products/’%20,%20p.key%5D admin-products.component.html
Continue readingThis command can only be run inside of a CLI project
Issue For some reasons, I want to use Angular v5 if I run the below command,it builds an app in angular 6 which I don’t want. ng new hello //this creates angular app in the latest version I ran the
Continue readingSend Reactive Form and picture in the same request
Issue I have Reactive Form with some of fields: this.pointForm = new FormGroup({ X_WGS84: new FormControl(null, Validators.required), Y_WGS84: new FormControl(null, Validators.required), country: new FormControl(null), state: new FormControl(null), … etc In the onSubmit method I assign fields from the form to
Continue readingERROR in Metadata version mismatch for module /var/www/html/idi/client2/node_modules/@ng-idle/keepalive/index.d.ts
Issue i have added ng-idle/keepalive. this is my package.json file { “name”: “azimuth”, “version”: “1.1.0”, “license”: “MIT”, “scripts”: { “ng”: “ng”, “start”: “ng serve”, “build”: “ng build”, “test”: “ng test”, “lint”: “ng lint”, “e2e”: “ng e2e”, “install”: “napa” }, “private”:
Continue readingHttp interceptor on response not working in angular 5
Issue I want the user to be automatically logged out if any api returns a 401 error response.And to do that I am intercepting every request and as soon as the error code comes 401 I am clearing the jwt
Continue readingHow can I get my Angular5 spyOn to work as expected?
Issue My test is not detecting changes. Here is my component: toggleUploadModal() { const modalRef = this.ngbModal.open(UploadFilesComponent, { size: ‘lg’, backdrop: ‘static’ }); modalRef.componentInstance.DeliverableTransaction = this.transactionDetails; modalRef.result.then((res) => { if (res.status === ‘success’) { this.deliverableTransactionService.updateDeliverableTransaction(this.route.snapshot.params.id, { submissionStatus: ‘In Process’ })
Continue readingwhy is RoutingModule not working in my angular app?
Issue edit : please note that everything was working fine before trying to split my app module into feature modules for lazy loading so I’m Trying to split my app module into other feature modules so that I can use
Continue readingAngular 5 – include jquery plugin
Issue Im new to angular, currently working with version 5. I have to install a plugin called ‘jquery-circle-progress’, which can be found here: http://kottenator.github.io/jquery-circle-progress/ I’ve installed it with via npm, and added the .js file to .angular-cli.json scripts array. It
Continue readingTemplateRef and click event
Issue I have a common template for different components but some buttons. So, I create a common component and change this buttons with ng-template: <component-common [buttonTemplate]=”buttonTemplate”> </component-common> <ng-template #buttonTemplate let-element=”element” let-method> <button (click)=”method”> element.name </button> </ng-template> In component-common.component.ts: export class
Continue readingTemplateRef and click event
Issue I have a common template for different components but some buttons. So, I create a common component and change this buttons with ng-template: <component-common [buttonTemplate]=”buttonTemplate”> </component-common> <ng-template #buttonTemplate let-element=”element” let-method> <button (click)=”method”> element.name </button> </ng-template> In component-common.component.ts: export class
Continue readingAngular 6 Reactive Form, FormArray Async Validator unable to highlight a FormControl
Issue I have a FormArray in a FormGroup and each of the FormArray has multiple FormGroup’s and can add them dynamically. I have an Async Validator where it needs all the data in the FormGroup to validate the minimum payRate,
Continue readingslide-toggle should not change when I click the `confirm cancel` button
Issue In my project I used slide-toggle to activate or deactivate a product. Everything works ok, only when I add a confirmation dialog, my slide change like in Demo. So when I click cancel, slide-toggle change when I click ok,
Continue readinggetting empty {} instead of id
Issue I’m trying to do update operation in Angular. When I submit after updating it shows random number at the end of the API instead of the particular id number. The request URL is like this Request URL: http://localhost:4200/api/auth/role/%7B%7D/ Instead
Continue readingError: Template parse errors: 'mat-card' is not a known element:
Issue I started an Angular 4 Material project about two months ago with all the current npm installs at that time, and am using most of the components from material.angular.io. since then Angular 5.0.0 has rolled out. I rebuilt by
Continue readingcan i use @viewChild to access an element in a different route?
Issue so lets say I have an element in a different component like navbar component which is always there in all routes ,, navbar has an Icon that Icon has a badge on it which is initially hidden and when
Continue readingCSS spacing issues in Angular 6
Issue We just recently upgraded to Angular 6 from Angular 5 and noticed the buttons/icons, etc has no spacing between them. We would like to restore the spaces between the buttons, etc. I have managed to reproduce the issues below.
Continue readingHow do I refresh ngIf method call from code
Issue I’m my angular 5 component’s HTML file I’ve attached an *ngIf to a td element: <tr *ngFor=”let ar of ars”> <td *ngIf=”showCompleteButton(ar)”> The issue I’m having is that the showCompleteButton accesses an element that might not yet have loaded
Continue readingexcel upload in Angular 5
Issue I am trying to export data to excel in angular 5 by using below code. Excel downloaded successfully. But data in excel is showing like: downloadReport(data:any){ let blob = new Blob([data], { type:’text/html’ }); let url= window.URL.createObjectURL(blob); var a
Continue readingAngular 5: Why in debug mode it's no show up 'Component is part of the declaration of 2 modules'
Issue When I run for debug mode with this command: npm run build, I will have all the dist folder and I can deploy the project. When I run for production with this command: npm run build — –prod, I
Continue readingEnvironment variables using in Nativescript with Angular 5
Issue I want to use the environment data in my native script with Angular application. I face the below error as “ReferenceError: process is not defined“. Run the application npm run android –env.apiUrl=”https://******.com/” –env.apiUserName=”****” –env.apiPassword=”*******” Angular service import { }
Continue readingRxjs : [ts] Property 'pipe' does not exist on type 'UnaryFunction<Observable<{}>, Observable<string | {}>>'. any
Issue I’m trying to implement ngbTypeAhead , but having an issue with RxJS , using 5.5.5 version . I’ve took this example from rxjs 6 version . “rxjs”: “^5.5.2” and angular “^5.0.1”, “typescript”: “~2.6.1”, when I tried to implement typeahead
Continue readingCannot read property 'schedule' of undefined
Issue The desired output is the BsDatePicker and for some reason is giving me the error: Cannot read property ‘schedule’ of undefined. and also have the warning BsDatepickerModule is under development, BREAKING CHANGES are possible, PLEASE, read changelog Angular-CLI version
Continue readingMapping the value of a json array using filter and groupby
Issue My json is like below. I am trying to group my objects based on the role id for target id equal to 1083. My json: [ { “id” :1, “role”: { “id”: “25”, }, “target”: { “id”: “1083”, }
Continue readingAngular 5 compile very slow and sometimes runs out of memory
Issue We have a medium-size Angular application. FWIW, Angular4 build produced app.js that is 4MB in size. We do not use Angular-CLI. When we first started it wasn’t available; and then it didn’t seem like we need it. The build
Continue readingConsuming Services In Angular5 is Not Working
Issue I am nearly new to angular and learning it from the Internet . My App is at Angular 5 and .Net core 2.1. I am trying to put some common method in a service instead of writing them again
Continue readingCustom action method not working in ng2 smarttable
Issue I am trying to add custom action “Copy” in Ng2SmartTable Grid. I am facing issue with click event handler of custom action. There are 3 buttons in grid Edit,Delete,Copy. Edit ,Delete is working fine. But ‘Copy’ method is not
Continue readingAngular Bootstrap Modal value setting inconsistency
Issue Update 2 <div *ngFor=”let c of uiVideos;let i= index” class=”row curriculum-single”> <button style=”display:none” data-toggle=”modal” data-target=”#videoReplace”></button> <app-upload-modal [id]=”i” ></app-upload-modal> </div> Update 1: Here is my upload-modal.ts export class UploadModalComponent implements OnInit { constructor() { } @Input() id:number; @ViewChild(‘toggleButton’) private toggleButton
Continue readingDoes not trigger the Web API from Angular 5
Issue I have attached my Component.ts, service.TS, AND in Web Api. Can you help me to get data from SP. I am using MVC . This is my component.ts GetComponentListForGrid() {this._componentservice.getAllComponentList(this.compartid_auto,this.progid,this.ComponentId,this.ComponentDescription,this.ComponentType, this.ComponentMake,this.EquipModel).subscribe(result => { console.log(‘GetAvailableCompartsAll’, result); this._componentList.push(…result); }, error =>
Continue readingComma-separated E-Mail ID validation via Regex in template in Angular 5?
Issue I have a project in Angular 5. There is an input field for E-Mail ID(s). I wanted to achieve the following: Allow the user to enter a maximum of 3 E-Mail ID(s), and obviously, each E-Mail ID would be
Continue readingI am facing problem in pushing my service data to the Array in ANGULAR
Issue I am trying to push Images which is coming from service to an Array , and using that Array I am trying to slide Images in my Application . I am putting the MY component FILE below import {
Continue readingInheritance of Angular 5 components with overriding the decorator properties
Issue In Angular 2/4 we could create custom decorator for extending parent component. Actual overriding of the decorator properties was handled as needed in the custom decorator. To get parent annotations we used: let parentAnnotations = Reflect.getMetadata(‘annotations’, parentTarget); After update
Continue readingAdal Angular5 Adal5Service.acquireToken falls with "Token renewal operation failed due to timeout", but there are successful requests in network
Issue Try to use adal-angular5 and have problem with Adal5Service.acquireToken method: it is always falls with: Token renewal operation failed due to timeout Online full example on StackBlitz. To test: paste your tenant paste your clientId register URL https://angular-96tws9.stackblitz.io in
Continue readingChange AG grid previous cellStyle dynamically based on condition of other nodes or row value
Issue I can able to change current cellStyle based on some condition of current node. But I have to change the immediate previous cellStyle based on some condition in current node. columnDefs = [ { headerName: “TripStatus”, field: “TripStatusCode”,cellStyle: this.cellStyling},
Continue readingHow to Update List On Html Component in Angular5
Issue I have component named “Alarms” in which i am calling this.getNotifications(); Function to get all notifications and binding those notifications as a list on my template. There is an option to clear each alarm. I am calling clearGatewayError() function
Continue readingAngular 5 and jQuery plugin overwriting the DOM
Issue I am integrating a jQuery plugin inside Angular and having some issues Plunker: https://next.plnkr.co/edit/pNCmYOo4vizJuj9V Notice the slider slides are displayed correctly then plunker first loads, click on “toggle” button to change the slides and notice that now slider is
Continue readingusing slice in an array doesn't affect the template
Issue I have an array availableBoats and I am rendering its elements using the following code snippet: <app-boat *ngFor=”let b of availableBoats” [size]=”b.size” [(available)]=”b.available” [type]=”b.type” ></app-boat> I was expecting that when I remove one boat from the array using the
Continue readingangular 5 unit tests fail when rxjs switchmap used
Issue I am trying to test a component where an action is dispatched on store and then some data is returned from inside this switchmap this issue is with unit testing this component. if I remove switchmap the code runs
Continue readingSubscribe method get call multiple times Angular 5
Issue I have one method subscribed in ngOnInit of controller.ts. From the view, there is an option to select the different user from listing which redirects to the same page just ID from URL gets changed. Hence ngOnInit gets invoked
Continue readingGetting browsermodule already loaded despite not importing it in lazy loaded modules
Issue I am getting the following error despite having taken steps to remove. Can someone tell me what am I missing here ? Error: ERROR Error: Uncaught (in promise): Error: BrowserModule has already been loaded. If you need access to
Continue readingPass parameters from .net dll (or console app) to angular app (angular 5)
Issue Here is my scenario.. I have a scanner (PENTA Scanner) which I’ll be using to scan Passport and DL. I have built an application which will extract required data (firstname,lastname,DOB) when a document is scanned. I have also built
Continue readingAngular header relative routerLink
Issue I am trying to make a global header in Angular6, with a dynamic list of hyperlinks, which are different for each page. The hyperlinks always reference some page, relative to the current URL. But the routerLink-s do not work
Continue readingHow to display Dropdown selected Item using Angular5/6?
Issue I want to display selected item in Dropdown list based on id. <div class=”formrow” *ngFor=’let a of applicantName’> <label>Status Selection :</label> <select id=”AStatus” formControlName=”AStatus” class=”form-control”> <option value=”0″>All</option> <option *ngFor=”let apt of applicantStatus” [value]=”apt.ApplicantStatusID” [selected]=”apt.ApplicantStatusID === a.Status”> {{ apt.ApplicantStatus }}
Continue readinghow to Auto Increment Image slider In Angular
Issue I am trying to Auto change Images in my Application which is coming from Array imgslider[] , I am putting the MY component FILE below import { Component, OnInit, Input } from ‘@angular/core’; import {HeadService} from ‘../service/head.service’; @Component({ selector:
Continue readingTrigger Event When focus out in Textarea
Issue I am trying to trigger an event when textarea focus is out. I have tried to use (blur) also. When I use (focusout) the method was trigger. But [(ngModel)] value saved as [object FocusEvent] This is my component.html div
Continue readingInjecting forward ref of ancestor through children to grand-child
Issue The Problem Right now I am using some components to obfuscate some of the more complex functionality away from the implementing devs allowing them to write blocks of code more easily. The stack of components looks like this from
Continue readingAngular 5 : how to dynamically bind events on button from a list
Issue <div id=”home” class=”tab-pane fade in” style=”text-align:left;opacity: 1;” > <button *ngFor=”let tool of toolArray” class=”m-btn btn btn-secondary” type=”button” (click)=”{{tool.ToolMethod}}()” placement=”bottom” ngbTooltip=”{{tool.Tooltip}}”> <img src={{tool.ToolImgPath}} alt=”” width=”24″ height=”24″/> </button> </div> Lets say , I have some tools managed by admin , if
Continue readingUnexpected token F in JSON at position 0 at JSON.parse (<anonymous>) in angular
Issue I’m trying implement role based authorization in my project.I’m trying to hide certain items from the navbar from the menu item depending upon the roles. I come across the above error. How do i resolve this? service.ts roleMatch(allowedRoles):boolean{ var
Continue readingNgIf block in Angular breaks Http Call
Issue Without the ngIf block the http call works fine and the table is getting populated without any issues but with the ngIf block, i m getting the error as <div *ngIf=”isloading; else other_content”> <ng-template #content> <mat-progress-spinner [color]=”color” [mode]=”mode” [value]=”value”>
Continue readingAny layout css for Angular 5 Material UI
Issue I was inspecting Material UI for Angular 5 and didn’t see any layout related css as part of the framework similar to Material UI for angual v1.x. Is there a way to achieve this or do I have to
Continue readingHow can I change form validation pattern based on dropdown selection?
Issue I’m setting up form validation in the UI for one of our projects. One of the text boxes needs to have a differing validation pattern based on the selection of a previous dropdown. For example, if the dropdown selection
Continue readingAngular 6 Reactive Forms Custom Validator getting error shown from Default Data
Issue I have a FormArray in a FormGroup and each of the FormArray has multiple FormGroup’s and can add them dynamically. I have a Custom Validator where it checks with all the data in each of the FormArray to validate
Continue readingASP.NET Core OData web service, Angular 5 and Grid Component in Kendo UI for Angular
Issue I would like to know if there is an easy way to bind Kendo Angular Grid to ASP.NET Core OData controller. What do I mean by easy ? Well, in Kendo UI for jQuery all we need to do
Continue readingUnmet peer dependency with ngx-webstorage but don't want to update to Angular 5.0.0
Issue I’m trying to build a project that someone else has created but got the unmet dependency issue. The NPM install command complains taht ngx-webstorage needs angular 5.0.0 and I indeed did not install 5.0.0 since the rest of the
Continue readingAngular 6 Reactive Forms Custom Validator Error Displayed from it's OWN data
Issue I have a FormArray in a FormGroup and each of the FormArray has multiple FormGroup’s and can add them dynamically. I have a Custom Validator where it checks with all the data in each of the FormArray to validate
Continue readingHow to stop for loop if response from api is false?
Issue How do I stop for loop if response comes false from the api?. I have below code for api integration. Now currently api is calling as per loop at one time. I want to do call the same api
Continue readingHow to change a mat-progress-bar value in an interval?
Issue I’m using angular 5 and I have a mat-progress-bar. I also have a timer with 2 * 60 value that means 2 minutes. I want to decrease the value of progress-bar each second and after 2 minutes the value
Continue readingHow to disable browser basic authentication popup – Angular 5 + Spring Security
Issue I have a problem with basic authentication popup made by browser. Despite of login form in Angular, after entering credentials and clicking login button, browser creates basic authentication popup. When i log in in the browser popup, all works
Continue readingAngular google maps uploaded KML Layer is not showing up on google map:
Issue I am facing an issue with KML upload into the AGM (Angular Google Maps API). I have added KML layer to AGM-Map with global URL of KML file. Application is giving no errors but KML is not showing on
Continue readingCustom attribute for select option and accessing it from AbstractControl in Angular 5?
Issue I would like to create a custom attribute for each option element in a select element, but I am having trouble creating one that can be accessed via AbstractControl and event.target. Here is what I have: I tried making
Continue readingFont awesome icons not showing up in Angular 5
Issue I installed it according to the instructions. First I’ve typed npm install –save font-awesome angular-font-awesome And it installed everything correctly. Then I changed in .angular-cli.json to contain the css like so: “styles”: [ “styles.css”, “../node_modules/font-awesome/css/font-awesome.min.css” ], And when I
Continue readingCheck how to access the array elements in Angular 5 HTML
Issue if array of elements like A and B in typescript file, how to check whether the A is present Solution if you have a property like arr and it value like this arr = [‘A’,’B’]; template <div *ngIf=”arr &&
Continue readingangular 5 conditionally validate field based on another field's value
Issue How to conditionally validate a field based on another field’s value? Here’s what i’ve tried but it seems not to work this.PDform = _formbuilder.group({ […] ‘intlNumber’: [”,this.nationality == ‘Abroad’ ? Validators.compose([Validators.pattern(this.phoneNumberExp), Validators.maxLength(14), Validators.minLength(11), Validators.required]) : Validators ] […] })
Continue readingAngular change notification on subproperty
Issue I’ve got a child component in my Angular 5 application that does two-way binding, and the binding is working properly. I’m having a bit of an issue with knowing about the change though in the parent controller. In the
Continue readingError when trying to add values to a class array variable in Angular 5
Issue I’m trying to create new object and push them to an array. This works when i use a local array localArr declared within the method, but seeing ERROR TypeError: Cannot read property ‘blobList’ of undefined when using a class
Continue readingcannot delete a particular user in modal
Issue I’m trying to delete a particular user. I was able to do it while i click the delete button. Button now I added a modal showing confirmation if I’m sure i want to delete or not. But when i
Continue readingUnable to display Toast message in Angular 5
Issue Hi I am developing web application in Angular 5. I am trying to display toast message in Angular 5 using https://www.npmjs.com/package/ngx-toastr. I have downloaded required npm modules and copied css to assets folder. Also I have added import {
Continue readingLogging entire response on console show the data. But when i try to get the individual property in typescript it gives undefined. Why?
Issue I am getting some response while catching a socket.io event in angular. when i log the whole response on console its showing all properties but when i try to get individual property then it gives undefined. I am attaching
Continue reading'subscribe' undefined error when returning Observable<Object[]> from service in Angular 5?
Issue I’m building objects new Azureblob(blob.name for each value retuned by external service and adding it to an Array new Azureblob(blob.name. Also able to return this from anonymous function return localArr. Questions: How can we return this through the method
Continue readingget data from a particular item on clicking
Issue I have a list of items stored in an array named “permissions” and the data is like this When i click on the particular item i want only the particular items data to be displayed. component.html <a class=”selected” (click)=”displayPermission()”>click</a>
Continue readingUpdate ngModel if it's not null angular 5
Issue I’d like to update [(ngModel)] using onclickevent only if the value is not null. Here’s what i tried click event method: setBiometricsStartTime() { let startTimeStore = new Date(); if(this.startTime == undefined) { this.startTime = new Date(); } else {
Continue readingHow to convert array into object in and iterate over list in angular 5?
Issue JSON: I have the json in which I want to iterate userids in list but I am able to fetch userids but not the content in a list. { “data”: { “items”: [ { “regions”: “India”, “ownerids”: “[master]”, “userids”:
Continue readingHow can I use some hardcoded data together with API in the same service in Anglular 2?
Issue I have a service which is retrieving data from API and displaying it in my component. All good, but together with the data from API I’m displaying in the component, I also want to display some hardcoded array data
Continue readingGetting undefined of inner array of JSON response in angular
Issue I have below JSON from api [ { “CinemaId”: “Hfsdfsdfs”, “FilmCode”: “HIWdfsdfsfsf47”, “FilmTitle”: “BAfsdfAAR”, “CinemaName”: “CsfsnfsfsAhmedabad”, “CinemaCity”: “Ahmedabad”, “CinemaLicenseName”: “BIGdfsfsAhmedabad”, “CinemaEmailId”: “himfsfsfilms.com”, “CinemaBannerImg”: “F&BCombo.jpg”, “CinemaAddress”: “5fsfdsfsdin Road, 380052, “, “CinemaMobile”: “93dfsdf17441”, “CinemaTel”: “0”, “CinemaLocation”: “<iframe src=\”fsdfdsdfdsf\” width=\”600\” height=\”450\” frameborder=\”0\”
Continue reading