Questions tagged angular-ngmodel

Explore the latest questions and answers asked by our top developers.

How to set default value selected if i use ngModel, ngValue and how to add placeholder in select

How to set default value selected if i use ngModel, ngValue and how to add placeholder in select <select [(ngModel)]="defaultSelect" (change)="onChangeGoods(query_param)" #query_param="ngModel" name="query_param" > <option [ngValue]="{‘sortBy’: ‘price’, ‘sortOrder’: ‘asc’}" > От дешевых к дорогим</option> <option [ngValue]="{‘sortBy’:’price’, ‘sortOrder’:’desc’}" > От дорогих к дешевым</option> <option [ngValue]="{‘sortBy’:’rating’, ‘sortOrder’:’desc’}" > По рейтингу</option> </select> <select [(ngModel)]="goods_for_brands[i]" (change)="onChangeBrand(brand)" #brand="ngModel" name="brand" id="brand" […]

limit number of checks for groups of checkboxes selected in angular

I am building Angular Website. I have data coming from server which contains info about options and sub options in my html <div class="radiobox" *ngFor="let mainOption of data.cartItem.option[0].options"> <h5 class="text-left" style="font-size: 16px;color: #4c5156;">{{ }}</h5> <!– <h6 class="text-left" style="font-size: 13px;color: #4c5156;">Choose Upto: {{mainOption.options[0].max}}</h6> –> <h6 class="text-left" style="font-size: 13px;color: #4c5156;">Choose Upto: {{mainOption.max}}</h6> <div class="row" style="flex-direction: column;margin: […]

Behavior of ngModel vs formControlName for radio elements

While working with validating same radio input elements with two different approaches viz. template-driven-form and model-driven-form, I am stuck with the scenario where for template-driven-form, using ngModel, I get single instance of control for 3 radio elements but for model-driven-form, using formControlName, I get 3 separate instances. <!– template-driven-form.component.html –> <div class="form-group gender"> <label for="gender">Select […]

Angular – prevent entering number outside of range in input type="number"

In my project I have an input type="number" where the user should enter a number between 1(always) and another number. I want to restrict the UI input element, is such way that only numbers in that range can be entered. My code so far: .html: <p>Allowed values are 1 – {{max}}</p> <input type="number" (input)="input($event)" /> […]

By cpper
Categorized as angular, angular-ngmodel, html-input, input Tagged , , ,

Angular 12: ngModel variable not updating after async get result

I know this issue is very common, but I have done some research already and didn’t find any solution for my case, I have tried some stuff like ngZone and setTimeout but won’t work. What I have is a component using ngModel that is updated via a get done by a service using a utility […]

ng-disabled doesnt disable date picker

I am implementing a simple date picker for an expiration date that needs to be disabled if the never checkbox is checked. Using the ng-model concept I have implemented it as below : <label>Click me to toggle: <input type="checkbox" ng-model="checked" /></label><br /> <input type="date" name="date" ng-disabled="checked" /> For some reason this doesnt work in my […]

By s om
Categorized as angular, angular-ngmodel Tagged ,

Setting value via DOM doesnt update the value of the input with ngModel using Angular

I am relatively new to Angular. I a trying to upload a file calculate its hash and put it in a inputbox. If I do so it correctly changes the displayed value in the form, but if I am submitting the form the value doesnt get send. Only if I click in the input field […]

By user15965549
Categorized as angular, angular-ngmodel, javascript Tagged , ,

"Can’t bind to ngModel" when using component from another module

I have hit a wall with this issue and I hope that somebody here can help me. My create-recipe.component in my recipe.module needs to use the raw-material-multi-select.component from shared-components.module. I declare and export RawMaterialMultiSelect component in SharedComponents module and import it in Recipe module, but I get the following error: Can’t bind to ‘ngModel’ since […]

By Anne-Katrine
Categorized as angular, angular-ngmodel, typescript Tagged , ,

Can’t bind to ‘ngModel’ since it isn’t a known property of ‘input’: FormsModule already imported

This question has been asked numerous times and its always the same answer: import FormsModule into your app.module.ts and declare it in the imports array of NgModule. This is exactly what I did and the error still persists. I am asking this question again because all other answers point to the one I just mentioned. […]

ngModel is not working (Forms Module I have imported)

I have imported forms module. Also I have included in imports section still I am getting error. It is highlighting error in html files only. I am not able to understand the issue. <textarea rows="6" [(ngModel)] ="enteredValue" ></textarea> <hr> <button (click)="onAddPost()">Save Post</button> <p>{{ newPost }}</p> Can someone please help me to understand the issue. I […]

1 11

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