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

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.