Company logo
  • Jobs
  • Bootcamp
  • About Us
  • For professionals
    • Home
    • Jobs
    • Courses
    • Questions
    • Teachers
    • Bootcamp
  • For business
    • Home
    • Our process
    • Plans
    • Assessments
    • Payroll
    • Blog
    • Sales
    • Calculator

0

75
Views
Passing computed value to form with angular

When I change the value in club dropdown, the ID visually changes, but nothing gets passed into my form. I keep getting null when try to insert the value from ID box to a table. Would appreciate any help

<div class="form-group">
  <label>id</label>
  <div class="form-control" name="club_api_id" ngDefaultControl [(ngModel)]="form.club_api_id">
    <tr *ngFor="let obj of klubbid" [value]="obj.id">{{obj.id}} </tr>
  </div>

This is how it look like:

this is how it look like locally

7 months ago · Juan Pablo Isaza
1 answers
Answer question

0

It looks like there are a few issues with the position where your form object is attached in the DOM.

  1. You have attached the form to the div "club_api_id"; div elements are not going to update the form, as the user does not usually have a way to change its contents.

  2. the "id" is not pegged to a form attribute at the moment, at least not from this part of the code you have shared. In this tr, the value of the id will be placed into the tr, but if the user changes it, it will not be placed into the form.

<tr *ngFor="let obj of klubbid" [value]="obj.id">{{obj.id}} </tr>

if you use a select instead of the tr and attach the form property to the value of this select, it should work:

<div class="form-control" name="club_api_id">
    <select  [(ngModel)]="form.club_api_id">
      <option *ngFor="let obj of klubbid" [value]="obj.id">{{obj.id}}</option>
    </select>
</div>
7 months ago · Juan Pablo Isaza Report
Answer question
Find remote jobs