Question

我想知道是否有办法在不使用<li class="<%= self_or_other(attachment) %>"> <div class="chatboxmessagecontent"> <a href="<%= attachment.attachment.url %>" download> <%= image_tag attachment.attachment.url, height: '64', width: '64' %> </a><br/> <time datetime="<%= attachment.created_at %>" title="<%= attachment .created_at.strftime("%d %b %Y at %I:%M%p") %>"> <%= message_interlocutor(attachment).name %> • <%= attachment.created_at.strftime("%H:%M %p") %> </time> </div> </li>标记的情况下验证 Angular 2 中的表单？例如下面我想让它成为必填字段

form

Answer 1

表单控件可以是独立的（没有父表单），无论是使用声明性表单控件还是反应式表单控件。

对于声明性（使用ngModel），您可以执行类似

的操作

<input #model="ngModel" [(ngModel)]="value" type="text" required/>
<div *ngIf="model.invalid" style="color: red">Required</div>

对于反应形式，您可以执行类似

的操作

<input [formControl]="control" [(ngModel)]="value" type="text"/>
<div *ngIf="control.invalid" style="color: red">Required</div>

// in component
this.control = new FormControl('', [Validators.required]);

请参阅Plunker

有关一般使用Angular表单的更多信息，请参阅the docs/tutorial

Answer 2

除了直接使用表单控件，如@peeskillet在其答案中所示，您可以使用其ngForm选择器将表单指令附加到任何标记：

<div ngForm #newRuleForm="ngForm">
  <div class="form-group">
    <label for="name">Name</label>
    <input type="text" class="form-control" id="name">
  </div>
  <button type="button" class="btn btn-default" [disabled]="!newRuleForm.valid" (click)="save()">Save</button>
</div>

请注意，在这种情况下，您无法使用<button type=submit>之类的标准表单功能，但是当我想使用模板驱动的表单同时保留一种简单的方法来验证组时，我觉得这种方法很有价值一起的田野。

如何在Angular2中应用没有<form>标签的表单验证

2 个答案: