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

171
Views
add dirty attribute to text and dropdownlist with [ngModelOptions]="{standalone: true}" in angular 8 (kendo)

I have a few dropdownlist tag that is binding dynamic data, so I need to use [ngModelOptions]="{standalone: true}". I know that using ngModelOption means ignoring the form attribute, is there any more that can add the dirty attribute to text or dropdownlist.

HTML file

<form #form="ngForm">
  <div #ngFor="let item of [].constructor(details.length); let i = index>
     <input [(ngModel)]="person[i].age" id="age" name="age" [ngModelOptions]="{standalone: true}"/>
     <kendo-dropdownlist [data]="personName" [(ngModel)]="person[i].name" id="name" name="name" [ngModelOptions]="{standalone: true}"></kendo-dropdownlist>
  </div>
 <input [(ngModel)]="city" id="city" name="city" />
 <button (click)="checkDirty()">CHECK DIRTY</button>
</form>

typescript file

@ViewChildren('form', {static: true})
public form: NgForm;
details = ["one","two"];
personName=["A","B","C"];
city="";
person = [{"age":"", "name":""},{"age":"", "name":""}];
checkDirty(){
  console.log(this.form.dirty);
  // when i type something in the city input, and click check dirty button, it return true
  // however, if i type anything in age input or select any value in name and click check dirty button, it always return false. 
}

I know that adding [ngModelOptions]="{standalone: true} basically means ignore the attribute in form. Is there any way that can add the dirty attribute manually for the dropdownlist name and input age?

7 months ago ยท Juan Pablo Isaza
Answer question
Find remote jobs