Issue I’m working on an application where I’m using PWA for the first time and I’m trying to work with push notifications etc. Currently I have PWA working if I execute the following commands ng build –prod and http-server -p
Continue readingTag: angular9
Conditional reset method "if disable ignore not disable reset" angular
Issue <div> <div> <label>Name</label> <input type="text" [(ngModel)]="name" [disabled]="editData" </div> <div> <label>address</label> <input type="text" [(ngModel)]="address" </div> </div> <button (click)=add() >add</button> <button (click)=edit()>edit</button> <button (click)=reset()>reset</button> Note:- On add() both fields should be reset but on edit only address field should be reset
Continue readingWhat's New in Angular 9?
Issue I tried to learn but not getting clear about the same. So anyone please send me the valuable links or points for the Angular 9 new features? Solution Added Angular 9 Features – Added undecorated classes migration schematic in
Continue readingBootstrap 4 colors are not changing in Angular 9
Issue I have made a custom scss file (modified-bootstrap.scss) to override bootstrap variables $theme-colors: ( “primary”: #84329b, “secondary”: #02bceb ); @import “node_modules/bootstrap/scss/bootstrap.scss”; // tried relative path too Then imported it in a file named base.scss which is added in angular.json.
Continue readingUpgrade from angular 8.2 to angular 9 issue
Issue When Upgrading from angular 8.2 to angular 9 I got this error An unhandled exception occurred: Cannot find module ‘@angular-devkit/schematics’ How can I overcome this error? this is the used command: ng update @angular/core @angular/cli –next Solution I can
Continue readingHow to access components unique encapsulation ID in Angular 9
Issue I’m trying to encapsulate my element ids by adding the instance id like this: <label for=”id-{{ unique }}-name”></label> <input id=”id-{{ unique }}-name” type=”text” formControlName=”name”> I previously worked with this: https://stackoverflow.com/a/40140762/12858538. But after upgrading Angular from 7 to 9 this
Continue readingAngular 9 – trackBy template type checking angular
Issue I have a simple trackBy statement which was no prob until ng9. <div *ngFor=”let s of skills; trackBy: s?.id”> <app-skill [skill]=”s”></app-skill> </div> Now with template type checking the compiler complains that: Property ‘s’ does not exist on type ‘SkillsListComponent’
Continue readingAngular 8 to 9, unable to import the service into the class that use inheritance
Issue Upgraded Angular from v8 to v9. The project use its “unique” way of defining things (instead of composition), for example classes that extend base classes along with the services. For example: export class TimeSeriesFormStrategy extends FormStrategyDruidBase { constructor( protected
Continue readingAngular CanDeactivateGuard: How to wait for the right or the next value of an Obersavble?
Issue I have a Service that emits events: export class MyService { private event = new BehaviorSubject<string>(‘init’); event$ = this.event.asObservable(); constructor() { } update(): void { this.event.next(‘update’); } accept(): void { this.event.next(‘accept’); } decline(): void { this.event.next(‘decline’); } } I
Continue readingAngular 9 – Duplicate column definition name provided – detailExpand
Issue I have a Problem that did not occur in Angular 8 and previous. With Angular 9 It seems that If I have Table (master) with an expandable container that has another table (child), angular considers the all the child
Continue readingSpread types may only be created from object types. Problem arrives with Angular 9
Issue getIssuersCollection() { return this.afs .collection(‘issuers’) .snapshotChanges() .pipe( map(docArray => { return docArray.map(doc => { return { id: doc.payload.doc.id, …doc.payload.doc.data() }; }); }) ); } The above code worked fine in Angular 8 but throw’s an error in Angular 9.
Continue readingDirectives not working with FormControl after upgrading to Angular 9
Issue I have used directives for enabling and disabling forms. This is in a separate typescript file. Code is given below: – import { NgControl } from ‘@angular/forms’; import { Directive, Input } from ‘@angular/core’; @Directive({ selector: ‘[disableControl]’ }) export
Continue readingCannot use Ng-bootstrap in Angular 9
Issue I started my first project in angular with ng-bootstrap and followed the installation procedure, but nevertheless It doesn’t work. The message is “Uncaught Error: It looks like your application or one of its dependencies is using i18n. Angular 9
Continue readingAngular 9 – ERROR in In Ivy, decorator metadata must be inline
Issue Angular 9 and ivy have only recently been published. But the migration is giving me a headache right now. Unfortunately the listed error is nowhere to be found and is not very meaningful. I ask for help! compilation error
Continue readingIs it possible to have no preselected entry in select in angular ivy
Issue In my angular application I’m using a select control for the users to make a seletion filling the option in a *ngFor loop. For the first call (or until the users set an actual value) the selection is empty,
Continue readingGet ViewChildren Template By Id
Issue In my component I get a list of its markup templates by using ViewChildren: @ViewChildren(TemplateRef) private _templates: QueryList<TemplateRef<unknown>>; In Angular8 I was not able to filter them by an Id, so i needed to look for an internal property
Continue readingDataTable: Print Not working in Angular 9 and Electron
Issue I have an android 9 app recently converted to Electron app. For DataTable, I have enabled Print and Excel options. Excel upload is fine and exporting data. But Print is not working. Its giving the following error TypeError: Cannot
Continue readingMigration from Angular 4 to 9
Issue It is advisable to migrate Angular 4 to 9 directly, or it would be better to go from 4 to 7 and then from 7 to 9? Solution using this link https://update.angular.io/ to what you have to do for
Continue readingElectron-Angular9 App showing blank white screen in Windows 7 , but working fine on Windows 8
Issue My Electron App built for Windows with electron-builder is working fine on windows 8 , but showing white blank screen when the setup file installed on Windows 7 Solution I could fix the issue After installing .NET 4.8 developer
Continue readingng-select server side loading icon incorrect placement
Issue I am using ng-select in my Angular 9 project to search and load server-side results. I followed the instructions from ng-select docs and implemented it. When the user starts typing I see loading icon placement is slightly above(shown below).
Continue readingUncaught ReferenceError: __importDefault is not defined; After going to Angular 9
Issue After running ng serve In the browser, developer tools, I see the following error: Uncaught ReferenceError: __importDefault is not defined at Module../src/app/home/home.component.ts (home.component.ts:5) at __webpack_require__ (bootstrap:79) at Module../src/app/app-routing.module.ts (main.js:98) at __webpack_require__ (bootstrap:79) at Module../src/app/app.module.ts (app.component.ts:8) at __webpack_require__ (bootstrap:79) at
Continue readingHow to style ng-bootstrap accordion?
Issue I want to add custom fade styling to accordion of ng-bootstrap! How can I achieve it? Solution Following Solution is for ng-bootstrap version 5.x.x & 6.x.x & Angular 8 & 9 Fade style won’t apply if the content of
Continue readingHow do you bootstrap Angular 9?
Issue My app is run in ElectronJs 8 which is the equivalent of Chrome 80 engine. With Angular 8, I’m using AOT and my main.ts has something like this in it: platformBrowser().bootstrapModuleFactory(AppModuleNgFactory) Based on what I’ve ready, I don’t think
Continue readingApp won't recognize swipes using Hammer.JS and HammerGestureConfig in Angular 9
Issue I can’t recognize swipes in my Angular app using Hammer.JS. It’s setup like this: “@angular/core”: “~9.0.0-next.6”, “hammerjs”: “^2.0.8”, “zone.js”: “~0.10.2” app.module.ts is looking like this: import { BrowserModule, HammerGestureConfig, HAMMER_GESTURE_CONFIG } from ‘@angular/platform-browser’; import * as hammer from ‘hammerjs’;
Continue readingng-bootstrap accordion : How to add class to wrapper of nbg-pannel?
Issue I want to add a class(‘open’) to the wrapper(ie. ‘card’ class) of the ngb-panel selector when ngb-panel is expanded. How can I achieve that? As per my research, I have used (panelChange)=’panelShadow($event)’ event to get the active panel (ie.
Continue readingMy map won't move with openlayers 6.2 and angular 9, even with DragRotateAndZoom interaction
Issue I’m trying to create a map, and as I can see on other sites and examples, everyone can move their map with mouseclick and drag. But my map wont move at all, anyone have idea what I did wrong?
Continue readingI have "ERROR in Internal Error: Unexpected interpolation" error when I run npm start in Angular 9
Issue I have this error when I run npm start: [HPM] Subscribed to http-proxy events: [ ‘error’, ‘close’ ] chunk {main} main.js, main.js.map (main) 2.16 kB [initial] [rendered] chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 722 bytes [initial] [rendered] chunk {polyfills-es5} polyfills-es5.js,
Continue readingCall a function inside ngFor in Angular 9 lose context
Issue I have updated my Angular project from 8.3 to angular 9 but now I’m loosing the context in a function called in a ngFor. I used apply to set my context: <div *ngFor=”let item of myMenu;”> <button (click)=”item.function.apply(this, [item])”>{{item.label}}</button>
Continue readingTest engine failure when FormGroup is used in Angular 9
Issue I have the following component: export class BaseFormComponent implements OnInit { basicFormGroup: FormGroup; constructor( protected basicProviderService: BasicProviderService, protected formBuilder: FormBuilder, protected dialog: MatDialog, protected spinner: NgxSpinnerService ) { this.basicFormGroup = this.formBuilder.group({ name:[”], note: [”, Validators.required], description: [”, Validators.required] });
Continue readingAngular v9 issue: Cant resolve all parameters for h: (?, ?, ?)
Issue I’m having the following issue when running “npm start” in my angular application. This happened to me after upgrading from ng8 to ng9.0.1. (With angular 8 everthing its working) I do not have circular denpendencies (already tested) I’m using
Continue readingIONIC5 and ANGULAR 9 upgrade – error NG8001 <ion-header> is not a known element
Issue I followed the guide to upgrade to Ionic 5 (after solving all deprecated warnings) and also to Angular v9. On the first build, I got a bunch of errors NG8001 is not a known element (for header, title, buttons,
Continue readingRender dynamic form based on dropdown
Issue i am trying to create dynamic form based on dropdown but i get the following error when i try it: field-builder.component.ts.FieldBuilderComponent.html:23 ERROR TypeError: Cannot read property ‘valid’ of undefined at FieldBuilderComponent.get isValid [as isValid] (field-builder.component.ts:45) at Object.updateDirectives (field-builder.component.ts.FieldBuilderComponent.html:26) at
Continue readingIncluding and Calling a Custom JS Script in Angular 9
Issue I want to use a custom floating button in my angular 9 project. I have added the custom scripts.js file in angular.json file, below is how the structure looks. “scripts”: [ “src/assets/js/custom/action-panel.js”, “src/assets/js/custom/scripts.js”, ] below is the code in
Continue readingNGXS Error: Can't resolve all parameters for TranslationEditorState: (?)
Issue I’m using NGXS for state management in Angular 9 application. In one of the state classes, any dependency injection causes an error “Error: Can’t resolve all parameters for TranslationEditorState: (?).” I’ve tried injecting a service and even the HttpClient,
Continue readingprovidedIn platform vs root
Issue I am struggling to see which one of the root and the platform options for providedIn in a service is better. Both make a service available in the whole application, the latter through a service and the former through
Continue readingAngular 9 – No component factory found for <component>
Issue After updating an Angular app from version 8 to 9, I’m getting the following error: No component factory found for <component>. Did you add it to @NgModule.entryComponents? But as stated on Angular Update Guide, adding components to entryComponents should
Continue readingAngular App cannot compile after update from V8 to V9
Issue I have recently updated my angular app from V8 to V9 using this guide provided by the official Angular site. I followed all the steps from the guide and the app was successfully updated, but now when I try
Continue readingImporting MatButtonModule does nothing
Issue I am building an Angular app using the Material library. I want to use the material button module package. I import it in app.module.ts like this (abbreviated example): import { MatTableModule } from ‘@angular/material/table’; import { MatCheckboxModule } from
Continue readingAngular 9 unsubscribe NavigationEnd
Issue I’m using a subscription on router NavigationEnd like this: this.router.events .subscribe((event) => { if (event instanceof NavigationEnd) { this.getData(); } }); I need this to update the page data when navigating in the same route e.g. /product1 and /product2
Continue readingThe generate command requires to be run in an Angular project asp
Issue When I try to use command to create component “ng g c new-component” appear this error: node.exe : The generate command requires to be run in an Angular project, but a project definition could not be found. En C:\Users\luisfe.moreno\AppData\Roaming\npm\ng.ps1:
Continue readingaggrid community Downloader Class not available in v22.0.0+
Issue I was using aggrid 21.1.0 with Angular 8. In one of my components I use the Downloader class gotten from ‘ag-grid-community’ in this way import { GridOptions, Downloader, ExcelExportParams} from ‘ag-grid-community’; and used in the code to Download a
Continue readingAJAX request not working on localhost CORS policy
Issue I am creating an angular application which involves working with API. I have created an API on my localhost and tried to request on it with AJAX. But it shows me the CORS error. I tried everything to solve
Continue readingAngular 9 – subscribed service and ActivationEnd router events
Issue I am having difficulties in accessing service data within ActivationEnd router service. My TS: export class ListConditionsComponent implements OnInit { conditions: Condition[]; fCon: string[]; constructor(private _service: ConditionService, private _router: Router, private _route: ActivatedRoute) { } ngOnInit():void { this._service.getConditions() .subscribe(data
Continue readingFacing issue at Instascan Library in Angular 6
Issue I have imported instascan library in Index.html file , <script type=”text/javascript” src=”https://rawgit.com/schmich/instascan-builds/master/instascan.min.js”> </script> I have code in my app.component.html as below, <video id=”preview”></video> I have code in my app.component.ts as below, let scanner = new Instascan.Scanner({ video: document.getElementById(‘preview’), mirror:
Continue readingStrange error during compilation – Angular 9
Issue I recently moved to Angular 9. In addition to the fact that my feature branch is not working after the rebase, I tried to switch to develop and update it (using pull origin develop). Everything seemed ok, instead I
Continue readingUse of jQuery code in Angular app.component.ts
Issue I am working on Angular app. I imported jQuery package using following code. $ npm install jquery –save I am trying to transfer my .js data of html web page to app.component.ts of angular. My setup for JQuery is
Continue readingCompile with angular 8 instead of the 9
Issue I recently installed Angular 9. I would like to experiment by trying to compile my project with Angular 8. Is it possible to choose the version with which to compile? Since I previously had Angular 8? Thanks in advance.
Continue readingAngular 8 to Angular 9 Migration
Issue After a successful upgrade of a library from Angular 8 to Angular 9 when I try to build it I get the following error: Compiling TypeScript sources through ngc ERROR: Decorator argument must resolve to a string An unhandled
Continue readingHow to update localeData and LOCALE_ID for i18n sites dynamically during build in Angular 9?
Issue I’m trying to build an application that supports multiple languages – up to 20 actually. The default language is en-US. During the build the translated versions are created which works fine. However, in all builds the LOCALE_ID is always
Continue readingHow to Use Enums for Service Method Params (in AngularProject)
Issue I’m working in an Angular 9 project. I have a service that I’m using in a component. A param for a method in the service is specifying the panelClass name. Instead of using strings, I’d like to use enums
Continue readingFormat the number from API in Angular
Issue I get Km ranges from from ASP.NET Core API and would like to format the number with 1000 seperator like: 75,000 – 100,000 – 125,000 so on. How do I achieve this with the following: JSON output: [ {
Continue readingHow can I solve Angular module import problem?
Issue It’s working import { MatButtonModule } from ‘@angular/material/button’ import { MatMenuModule } from ‘@angular/material/menu’ Not Working import { MatButtonModule,MatMenuModule } from ‘@angular/material’ Why do you think it would be? Solution That’s no longer supported in Angular’s 9th version. Components
Continue readingHow to bind parent component using child component's event property using `lazy loading` in Angular 9
Issue I am converting some components to be lazily loaded using the ivy compiler in Angular 9. This is my code at the moment: <bulk-user-upload [visible]=”bulkUserUploadVisible (fileUploaded)=”onBulkUserUploadFileUploaded($event)”> and I am trying to modify the code become like this: <ng-container #bulkUserUpload></ng-container>
Continue readingAngular 9 SSR Build Serve eror — ERROR ReferenceError: document is not defined
Issue ERROR ReferenceError: document is not defined import { readFileSync } from ‘fs’; const domino = require(‘domino’); // import the library `domino` const DIST_FOLDER = join(process.cwd(), ‘dist/browser’); const template = readFileSync(join(DIST_FOLDER, ‘index.html’)).toString(); // use `index.html` as template const win =
Continue readingGeolocation: ERROR TypeError: Cannot set property 'lat' of null
Issue Introduction I’m working on an Angular application where I want to get the current position of the user and save the longtitude and altitude in two properties lng and lat, yet this doesn’t seem to work and no matter
Continue readingBest way to make an HTTP Post with json body in angular 9
Issue Hi there i am working on a project where i need to save 3 text box fields. I am having a hard time finding out how to post with a json body. This is what I have so far.
Continue readingangular drop event is inconsistent
Issue Minimal reproduction: https://stackblitz.com/edit/buggydrop I’m making a simple website when user drag an element and drop it on another element so that the content of each element swap with each other. However, the problem is in (drop)=”BuggyonDrop($event)” the $event is
Continue readingAngular 9 – cookie been saved on wrong domain
Issue My client side and server side run on different domains. and when I do a login to the server I save the cookie on the response. but Angular save that cookie only for the client-side domain for some reason…
Continue readingAngular Differential loading – How to generate only one polyfill.js file
Issue We just migrated from angular 7 to angular 9. My application targets to larger audience and i need to support legacy browsers like IE-11. Hence i have made the following change in tsconfig.json { “compileOnSave”: false, “compilerOptions”: { “outDir”:
Continue readingIntegrate vasturiano / `sunbrust-chart` with Angular 2-9
Issue It is there a way to integrate vasturiano/sunburst-chart with Angular 2 – 9? I am trying this, but is not working. import { Component, OnInit } from ‘@angular/core’; import Sunburst from ‘sunburst-chart’; import { sbdata } from ‘../chart-options/sunburst-mockdata’; @Component({
Continue readingAngular 9 – Routes
Issue I’m very new at Angular 9. These are my routes: http://localhost:4200/pc_configuration –> then go to login http://localhost:4200/PC2/login — it works fine, but when I login, dashboard overwrite the id (PC2) http://localhost:4200/dashboard/ — it should be http://localhost:4200/PC2/dashboard/ These are my
Continue readingR3InjectorError No provider for NgbDropdown
Issue I have a shared module A where I import and export NgbDropdownModule import { … NgbDatepickerModule, NgbDropdownModule, NgbModalModule …} from ‘@ng-bootstrap/ng-bootstrap’; imports: […NgbDropdownModule…] exports: […NgbDropdownModule…] In module B I just import module A and up to Angular 9 everything
Continue readingReusable component not seen by children routes components
Issue I have 2 lazy loaded routes: const routes: Routes = [ { path: ”, redirectTo: ‘login’, pathMatch: ‘full’ }, { path: ‘login’, loadChildren: () => import(‘./login/login.module’).then(m => m.LoginModule) }, { path: ‘dashboard’, loadChildren: () => import(‘./dashboard/dashboard.module’).then(m => m.DashboardModule) }
Continue readingRedirecting in case of a 401 on JWT refreshing
Issue I’m currently developing an Angular 9 application with JWT authentication on the backend. I’ve followed a tutorial that has guided me through making an HTTPInterceptor to refresh my JWT if it is expired, using the refresh token. My tokens
Continue readingcan we use ngModel and ngChange in the same component
Issue arr= [{ isNew: true, price: { perDay: 0, perMonth: 0, perHalfDay: 0 }, type: 3, available: false, newCapacity: 0, inventory: 1 }…] <div *ngFor=”let obj of arr”> <input [(ngModel)]=”obj.inventory”> </div> On change of a particular inventory I want to
Continue readingwait Until a second Observable emits
Issue In Rxjs, there is the pipe takeUntil but there isn’t a pipe wait Until, that makes the current observable waiting for a seconde Observable to emit. My Final Goal is to make many Observable still waiting until my Observable
Continue readingdo toggle operation onoverlayPanel in.ts
Issue I need to do toggle operation on a element : <p-overlayPanel #panel>… I must take it in my .ts code: @ViewChild(‘panel’) someInput: ElementRef; this.someInput.toggle() and after I don’t knwo what I have to do? anyone can help me? Solution
Continue readingSplitting project into modules – one module don't work
Issue I am trying to split angular 9 application into multiple modules in order to improve the performance of the application (lazy-loading etc). For now I’ve created two modules – blog and admin module. I don’t know why but admin
Continue readingAngular View Component Data Loss during Reload Refresh using BehaviorSubject
Issue I am writing an Angular9 app with a use case where I am buffering data across 3 pages (with forms taking data input). Then, on the 4th page, I display a summary of the details gathered across the 3
Continue readingAngular9 ReactiveForm returns null value on Submit
Issue I’m just getting nuts. I tried to build a simple login form with username and password. I used the Reactive Forms approach from Angular and I always get null values returned when submitting the form. The form state always
Continue readingRefresh mat-table in angular 9
Issue When I delete element my MAT-TABLE is not refresh .ts file import { MatTableDataSource, MatTable } from ‘@angular/material/table’; @ViewChild(MatTable) table: MatTable<any>; const index = this.dataSource.data.findIndex(d => Number(d.id) == Number(id)); this.dataSource.data.splice(index, 1); this.table.renderRows(); .html file <table mat-table [dataSource]=”dataSource” class=”lessons-table mat-elevation-z8″
Continue readingAngular material expandable table doesn't work
Issue I want to reproduce the “Table with expandable rows” example from https://material.angular.io/components/table/examples. I’ve created a new Angular project, added Angular material and literally copied the example content into my project. And yet, the rows are not expanding as in
Continue readingReset Angular 9 Reactive From Validation
Issue I try clear controls clear control forms and validation but in angular 9 does not work correct. Ofcourse I have cleared controls but I get validations on my controls. I check also other examples validation this.carForm = new FormGroup({
Continue readingangular 9 Pagination Example Type 'String' is not assignable
Issue I am in new in angular 9. I am currently working on angular 9 pagination. Please Help Me.. Angular 9 pagination into HTML table using ngx-pagination. src/app/app.component.html:20:17 – error TS2322: Type ‘String’ is not assignable to type ‘string |
Continue readingAngular resolver
Issue I’m creating a resolver for my routes following the documentation on that subject. export class PlaceDetailResolverService implements Resolve<Place> { constructor(private api: ApiService, private router: Router) {} resolve(route: ActivatedRouteSnapshot): Observable<Place> | Observable<never> { let id = route.paramMap.get(“id”); return this.api.getPlace(id); }
Continue readingAlternative route to disallowed guarded route?
Issue In case of the router below, is it possible to set an alternative route (like / for instance) for when AdalGuard disallows access to route /int or to one of its children routes? I knew I could do this
Continue readingWhy does testing with template driven return undefined value?
Issue I’m trying to test a simple form using template-driven forms in Angular 9. I insert values into the inputs and click on a submit button, which sends the values to a service. The code works, but the test fails
Continue readingReal UseCases for ngDoCheck (Angular9)
Issue I am a beginner in Angular & learning by myself and i have stucked in ngDoCheck life cycle method According to Documentation: Detect and act upon changes that Angular can’t or won’t detect on its own. Parent Component: user={
Continue readingAngular 9, KeyCloak, ServiceWorker and Edge Browser
Issue I am having a big problem as our Angular application is running fine with Angular 9.1 KeyCloak and Service Worker on Safari, Chrome and Firefox. But on Edge the page is staying blank. When I enter private browser mode
Continue readingDifficulty updating minimist with Angular 9
Issue I’ve been doing an Angular 9 project for some time now. A while back, a warning popped up about a moderate security vulnarability with the minimist package. However, when I try to fix them with (sudo) npm audit fix,
Continue readingPush ArrayItem from another array in Angular
Issue Im in a situation where I need to push an array item from another array. export class Products { ProductCat: string; Products: number; Sold: number; } export class ProdCats { Id: number; Category: string; } prodCats = ProdCats[]; products
Continue readingHow to avoid unnecessary calling API when changing sub-routes with :id
Issue I have a quite common scenario and I wish to know what would be the industry standard/best way to handle this problem. The Problem Let’s say you have multiple routes: /organization /organization/:id /organization/:id/users /organization/:id/users/:userId /organization/:id/payments … you get the
Continue readingAngular Karma Testing – browser property as Chrome vs ChromeHeadless
Issue I’m working in an Angular 9 project, and we’re running tests with Karma. Can anyone explain to me the difference between setting the browser property (in karma.conf.js) as Chrome and ChromeHeadless? The only real I see is that is
Continue readingHow do I get my observable to have it's values for use in an NGRX effect
Issue To be honest I am a total noob at NGRX and only limited experience in rxjs. But essentially I have code similar to this: @Effect() applyFilters = this.actions$.pipe( ofType<ApplyFilters>(MarketplaceActions.ApplyFilters), withLatestFrom(this.marketplaceStore.select(appliedFilters), this.marketplaceStore.select(catalogCourses)), withLatestFrom(([action, filters, courses]) => { return [courses, this.combineFilters([
Continue readingCan't bind to 'ngForOf' since it isn't a known property of 'li' Angular 9
Issue This question has been asked multiple times here and after going through enough solutions, I am positing because the common solution of making sure I have CommonModule in my child module and BrowserModule in my app.module.ts is not working.
Continue readingAngular 9 Ivy, NgControl not initialized in Directive
Issue I’m attempting to update my project to Angular9 / Ivy and face following problem. I have a custom “disabledControl” directive, as described in the following Blog (https://netbasal.com/disabling-form-controls-when-working-with-reactive-forms-in-angular-549dd7b42110). I’m using it in a reactive form with an expression to enable
Continue readingAngular – After Build Inner Routing Not Working – 404 Error
Issue I am using Angular 9.0 and everything is working fine in ng serve -o mode but when i try to build the project using ng build i can only view the root page. When i try to go to
Continue readingload function in mat-tab when selected – Angular 2 material using mat-tab-group
Issue How can I add action to mat-tab when selected ? In my case i want to set laodCard=true when the card is selected. here is the code i wrote, but action (click) does not work <mat-tab label=”second tab” (click)=”loadCards(true)”>
Continue readingAngular9 debugElement.classes['my-class'] now returns undefined
Issue I’m updating a repo that used to use Angular 8. In a test, using TestBed, I’m checking if a class exists using: fixture.debugElement.classes[‘my-class’].toBe(false) After updating to Angular 9, this test no longer works, as the expression no longer returns
Continue readingErrorcan't bind *ngFor
Issue I’m a beginner in Angular and I’m trying to create an application that looks like CapitalistAdventure. But I have an error that I can’t resolve and would like to receive some help please. First of all here is how
Continue readingData returned as undefined in ngOnInit() but not in function
Issue I’m returning data from an API and I’ve put in several console.log() statements for debugging. In the ngOnInit(), the console.log is printing undefined, but in the separate function the console.log returns the correct data and in theory, no other
Continue readingType 'Observable<UI[] | Promise<any>>' is not assignable to type 'Observable<UI[]>'. Type 'UI[] | Promise<any>' is not assignable to type 'UI[]'
Issue I need to return a list of UI and I do this method: getList(): Observable<UI[]> { return this.httpClient.get(“/api/listui”).pipe(map( (response:Response) => { return response.json(); }, ), catchError((error) => { return throwError(error); })); } In my vs code the error appears
Continue readingMissing property @ViewChildren
Issue I’m a beginner in Angular and I would like to receive some help for a problem that understand the origin but I don’t know how to resolve. So I would like to receive some help please. First of all
Continue readingError running Jest tests after upgrading to Angular 9: TypeError: Cannot read property 'ngModule' of undefined
Issue I upgraded from Angular 8.2 to Angular 9. My project is working as expected, as is the build however many of the tests are failing with this error: TypeError: Cannot read property ‘ngModule’ of undefined at isModuleWithProviders (../packages/core/src/render3/jit/module.ts:530:37) at
Continue readingAngular interceptor, handle HTTP Error and retry
Issue I have a basic JWT system, and an Interceptor that checks whether the request fails due to being unauthorized. import {Injectable} from ‘@angular/core’; import {HttpErrorResponse, HttpEvent, HttpHandler, HttpInterceptor, HttpRequest} from ‘@angular/common/http’; import {Observable, throwError} from ‘rxjs’; import {AuthService} from
Continue readingImport global LESS file in Angular's component
Issue On an Angular 9 home.component.less file I tried to import a global less file: @import (reference) ‘./mixins.less’; The file is on the project root along with index.html. So the structure is: src mixins.less index.html app home home.component.less When I
Continue readingAngular 9 material show the mat card as parent and child as graph
Issue I am new to angular 9. I want show the mat-cards as parent and child with graph. Below is the data [ { “id” : “ajson1”, “parent” : “#”, “text” : “Simple root node” }, { “id” : “ajson2”,
Continue readingAngular 9 update object in array of objects
Issue As the title says I need to update one value in array. <div *ngFor=”let item of data; let i = index” > <div class=”full-w” fxLayout=’row’ fxLayoutAlign=’start center’ fxLayoutGap=’12px’> <span class=”title”>Color: </span> <span>{{item.color}}</span> </div> <mat-divider class=”full-w”> </mat-divider> <div *ngFor=”let e
Continue readinghow to input two route parameters one of which is in between the URL for navigation while using children routes in Angular CLI 8+ using Angular Router
Issue I am trying to navigate to a page providing two route parameters as follows: author/journals/:journal_Id/draftArticles/:articleId I know that two parameters can be given when route parameter is at the end of the route like author/journals/draftArticles/:journal_Id/:articleId, journal_Id, articleId and this
Continue readingAngular. Custom tag selector in ng-template
Issue I refactor a string. So that why I need a component for it with ComponentFactoryResolver: @Component({ selector: ‘[text-in-message]’, template: `<ng-template chunk></ng-template>`, }) export class TextInMessageComponent implements OnInit { @Input() message: string; @ViewChild(ChunkInMessageDirective, { static: true }) chunkOfMessage: ChunkInMessageDirective; constructor(private
Continue reading