Angular incorrectly setting input class as valid

I have this input field <input formControlName="fieldName" class="validate" id="fieldName" type="text"> <label for="fieldName">{{field.fieldLabel}}</label> <ng-container *ngIf="myForm.controls.fieldName.touched && myForm.controls.fieldName.invalid"> <span class="helper-text" data-error="Error message" *ngIf="myForm.controls.fieldName.errors.pattern"></span> </ng-container> When I inspect it in console, before typing anything, I get this: <input _ngcontent-lqx-c2="" class="validate ng-untouched ng-pristine ng-valid" formcontrolname="fieldName" id="fieldName" type="text" ng-reflect-name="fieldName"> After I type a wrong value, I get this: <input _ngcontent-lqx-c2="" […]

Send separate requests instead of one whole in Angular

I want to modify this function to send these two file ids in the separate requests: return this.upload(myForm).pipe( take(1), switchMap(res => { body.user.profilePic = res.data.profilePic; body.user.coverPic = res.data.coverPic; return this.http.post<IRresponse<object>>(environment.api + EndPoint.CreateUser, body); }) ); Should I use flatmap? Source: Angular Questions

By lucas
Published
Categorized as angular, http, rxjs, typescript Tagged , , ,

Angular p-dropdown create options dynamically from one options array

I am trying to create multiple dropdowns in Angular and need every drop down to display one less option. I got this far but now my dropdown always initializes with a value. I have multiple dropdown and try to use one single options array and generate my data based on these options. I also dont […]

By lucas
Published
Categorized as angular, primeng, primeng-dropdowns Tagged , ,

Angular validation within dynamic forms

I’m using Angular Material and trying to display the errors. The problem is that I can’t connect to the actual value. This is my component.ts code: myForm!: FormGroup; constructor(private fb: FormBuilder) { } ngOnInit() { this.myForm= this.fb.group({ users: this.fb.array([]) }); } //getting users as a form arr get Users(){ return this.myForm.get(‘users’) as FormArray; } //adding […]

How to stop Chrome DevTools Sources tab from opening framework files on page reload

How do you stop Google Chrome DevTools Sources tab from opening framework files on page reload? I am debugging an Angular project via IntelliJ and every time I reload a page, DevTools opens and pauses on about 5 to 10 different framework files for just under a second each, leaving a few open and closing […]

Hybrid Angular Promise rejection

I am trying to wire up Angular 2 with AngularJs. Would anyone know why loading external js fails, inline works just fine. app.module.ts: platformBrowserDynamic().bootstrapModule(AppModule).then(platform => { console.log(‘Bootstrapping in Hybrid mode with Andular & AngularJs’); const upgrade = platform.injector.get(UpgradeModule) as UpgradeModule; upgrade.bootstrap(document.body, [‘ToDo’]); }) AngularJs file: This works: <html> <head> <script src=”https://ajax.googleapis.com/ajax/libs/angularjs/1.6.2/angular.min.js”></script> <script> angular.module(‘ToDo’, []) .controller(‘todoController’, […]

By lucas
Published
Categorized as Uncategorized Tagged ,

Still Have Questions?


Our dedicated development team is here for you!

We can help you find answers to your question for as low as 5$.

Contact Us
faq