0

I am trying to create a form in Angular 6 which has a list of YouTube links and the type. I have an *ngFor to create the list of input fields but i cannot add validation to them.

<div *ngFor="let link of links; let i = index;">
    <label [ngClass]="{ 'invalid': videoUrl.touched && videoUrl.invalid }">
      <i class="icon-youtube"></i>
      <input 
        type="text" 
        name="video-url" 
        #videoUrl="ngModel" 
        placeholder="Paste YouTube video link here" 
        [(ngModel)]="link.url" 
        required 
        pattern="[0-9]+">
    </label>
    <ul class="validation">
      <li *ngIf="videoUrl.errors.required">
        This field is required, please paste a valid video link.
      </li>
      <li *ngIf="videoUrl.errors.pattern">
        Video link is invalid, check the link again and retry.
      </li>
    </ul>
</div>

Since the fields are inside an *ngFor i don't know how to create the #videoUrl reference an array.

Thank you in advance, Daniel!

2

0

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.