You can use Injector for this. Inject it via constructor as usual, and then when you will need some service that leads to the circular dependency, get that service from it. class HttpService { constructor(private injector: Injector) { } doSomething() { const auth = this.injector.get(AuthService); // use auth as usual } }
You can use a directive @Directive({ selector: ‘ngInit’, exportAs: ‘ngInit’ }) export class NgInit { @Input() values: any = {}; @Input() ngInit; ngOnInit() { if(this.ngInit) { this.ngInit(); } } } you can use it to pass a function to be called like <div [ngInit]=”doSomething” or to make values available <div ngInit [values]=”{a: ‘a’, b: ‘b’}” … Read more
Update Per the comments below the original answer was not entirely clear — Angular is built with Angular CLI, which is a node application, but you aren’t able to access process.env directly from within the app during that build process, as it’s not processed as a Node application. The concepts stay pretty much the same, … Read more
As mentioned, Angular Route Guards are a good way to implement conditional routes. Since the Angular Tutorial is a bit wordy on the topic, here is a short summary how to use them with an example. 1. There are several types of guards. If you need something of the logic if (loggedIn) {go to “/dashboard”} … Read more
You should follow these 3 steps step 1: import ts-xlsx refer: https://www.npmjs.com/package/ts-xlsx for installation step 2: Using FileReader convert to arraybuffer step 3: Reading the arraybuffer with XLSX and converting as workbook HTML CODE <input type=”file” style=”display: inline-block;” (change)=”incomingfile($event)” placeholder=”Upload file” accept=”.xlsx”> <button type=”button” class=”btn btn-info” (click)=”Upload()” >Upload</button> Typescript //import it import * as XLSX … Read more
It usually happens when you develop Angular applications. To solve this just shut down the server & start it again: $ ng serve Explanation This happens because when you start the application, The server is actually serving the bundles(JavaScript/CSS/HTML… output files) stored in the dist folder. Sometimes, when you make changes in your code, the … Read more
Now, you don’t need to use FormBuilder and all this complicated valiation angular stuff. I put more details from this (Angular 2.0.8 – 3march2016): https://github.com/angular/angular/commit/38cb526 Example from repo : <input [ngControl]=”fullName” pattern=”[a-zA-Z ]*”> I test it and it works 🙂 – here is my code: <form (ngSubmit)=”onSubmit(room)” #roomForm=’ngForm’ > … <input id=’room-capacity’ type=”text” class=”form-control” [(ngModel)]=’room.capacity’ … Read more
To solve your issue, you simply need to get and store the size of the div in a component property after each resize event, and use that property in the template. This way, the value will stay constant when the 2nd round of change detection runs in dev mode. I also recommend using @HostListener rather … Read more
In Angular 8 the file browserlist have to be in project root folder. Following entries were needed on my project to disable differential loading: > 0.5% last 2 versions Firefox ESR not dead not IE 9-11 not samsung 4 not android 4.4.3-4.4.4 not last 2 ie_mob versions not last 2 op_mini versions not last 2 … Read more
Property binding like [trueValue]=”…” evaluates the expression “…” and assigns the value “true” evaluates to the value true “Y” is unknown. There is no internal Y value in TypeScript and no property in the component class instance, which is the scope of template binding. In this case you would want [trueValue]=”‘Y'” Note the additional quotes … Read more