相关疑难解决方法(0)

我想在使用Angular 2的表单中使用单选按钮

Options : <br/>

1 : <input name="options" ng-control="options" type="radio" value="1"  [(ng-model)]="model.options" ><br/>

2 : <input name="options" ng-control="options" type="radio" value="2" [(ng-model)]="model.options" ><br/>

model.options初始值为1

加载页面时,不会检查第一个单选按钮,并且修改不会绑定到模型

任何的想法 ？

我希望用户单击"提交"按钮,模式会自动关闭.

如果我添加data-dismiss="modal"提交<button>,它将无法运行submitComments().

我试图做一些类似的事情$('#myModal').modal('hide');,但没有成功.

那么如何关闭Angular 2中的模态呢？谢谢

<button type="button" class="btn btn-info" data-toggle="modal" data-target="#myModal">Open Modal</button>

<div id="myModal" class="modal fade">
     <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-body">
                <form (ngSubmit)="submitComments()">
                    <div class="form-group row">
                        <label class="form-control-label col-sm-2">Comments:</label>
                        <div class="col-sm-10">
                            <textarea class="form-control" rows="3"></textarea>
                        </div>
                    </div>
                    <div class="form-group row">
                        <div class="col-sm-offset-2 col-sm-10">
                            <button type="submit" class="btn btn-default">Submit</button>
                        </div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>

.

submitComments() {
    // I want to do something like $('#myModal').modal('hide'); here.
}

我很难在表单中使用*ngIf和ngFormModel来验证表单.

用例是这样的:根据用户输入,隐藏或停用表单中的某些特定字段.但是如果显示这些输入,则必须对它们进行验证.

当只需要基本验证时,我可以这样或那样做:

• 如果仅需要输入,则使用ngControl和使用A-OKrequired
• 如果需要特定格式,则可以使用该pattern属性.它不是Angular,但它有效.

但是为了实现更复杂的验证,我一直在尝试使用ngControl耦合ngFormModel来使用自定义检查.我使用了以下页面中的代码片段:

如何在angular2中添加表单验证模式(以及那里引用的链接)

Angular2表单:Validations,ngControl,ngModel等

我的代码如下:

HTML

<div>
  <h1>Rundown of the problem</h1>
  <form (ngSubmit)="submitForm()" #formState="ngForm" [ngFormModel]="myForm">
    <div class="checkbox">
      <label>
        <input type="checkbox" [(ngModel)]="model.hideField" ngControl="hideField"> Is the input below useless for you ?
      </label>
    </div>

    <div *ngIf="!model.hideField">
      <div class="form-group">
        <label for="optionalField">Potentially irrelevant field </label>
        <input type="text" class="form-control" [(ngModel)]="model.optionalField" ngControl="optionalField" required #optionalField="ngForm">
        <div [hidden]="optionalField.valid || optionalField.pristine" class="alert alert-warning">
          This input must go through myCustomValidator(), so behave.
        </div>
      </div>
    </div>

    <button …

我有以下表格：

import { Component } from '@angular/core'

@Component({
    selector: 'form1',
    template: `
      <div >
        <form (ngSubmit)="onSubmit(f)" #f="ngForm">
           <input ngControl="email" type="text" id="mail" required>                              
           <input ngControl="password" type="text" id="password" required>
           <input ngControl="confirmPass" type="text" id="confirmPass" required>                                
           <button type="submit">Submit </button>
        </form>
      </div>                    `
})
export class Form1Component{
    onSubmit(form:any){
      console.log(form.value);
    }
}

问题是form.value只有一个空对象并且没有ngControl指令值的迹象。我错过了什么吗？