Angular 6动态添加模板参考

时间:2018-09-01 09:16:38

标签: angular

我正在尝试在Angular 6中创建一个包含YouTube链接和类型列表的表单。我有一个*ngFor来创建输入字段的列表,但是我无法对其进行验证。

<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>

由于字段位于*ngFor内部,因此我不知道如何创建#videoUrl引用数组。

丹尼尔,谢谢你!

0 个答案:

没有答案