Question

我正在开发一个angular2应用程序，我正在使用primeng作为UI元素。我在下拉列表中使用这些下拉列表中的选项是从API调用动态生成的。现在，当我单击提交按钮时，我希望它在提交之前验证表单。所以我使用'required =“required”'来进行验证。

我看到，如果数据没有加载到下拉列表中，验证工作正常，但是当加载数据并填充下拉选项时，primeng验证会中断并且不会抛出任何消息。

这是我的HTML代码..

<div method="post" class="content-form">
                            <div class="col-lg-6">
                                <form  #myForm="ngForm" class="form-horizontal" novalidate>
                                    <div class="form-group">
                                        <label for="inputEmail3" class="col-sm-2 control-label">System of Origin</label>
                                        <div class="col-sm-10">
                                          <p-dropdown class="contentDetails" [options]="systemOfOrigins" [(ngModel)]="defaultSoO" [ngModelOptions]="{standalone: true}"   required="required" filter="filter" placeholder="NONE"></p-dropdown>
                                        </div>
                                    </div>

                                    <div class="form-group">
                                        <label for="inputEmail3" class="col-sm-2 control-label">Content Type</label>
                                        <div class="col-sm-10">
                                          <p-dropdown  class="contentDetails" [options]="contentTypes" [(ngModel)]="selectedContentType" [ngModelOptions]="{standalone: true}"  filter="filter"  required="required" placeholder="Choose"></p-dropdown>
                                        </div>
                                    </div>
                                    <div class="form-group">
                                        <label for="inputPassword3" class="col-sm-2 control-label">Rendition</label>
                                        <div class="col-sm-10">
                                         <p-dropdown id ="rendition"  placeholder="Select Rendition" class="contentDetails" [options]="renditions" [(ngModel)]="renditionSelected" [ngModelOptions]="{standalone: true}"  filter="filter" required="required"></p-dropdown>
                                        </div>

                                    </div>
                             </form>

我没有正确使用所需的属性，还是有其他方法可以使用API调用？感谢帮助

Answer 1

required是一个布尔属性。如果你动态设置它，[required] =＆＃34; isRequired＆＃34 ;,否则需要=＆＃34; true＆＃34;应该为你做。

尝试更换required =＆＃34; required＆＃34; with required =＆＃34; true＆＃34;并看看是否需要它们。如果没有，我建议添加一个plunkr

Answer 2

如果在options数组中有一个虚拟的第一个元素用于显示，请选择文本，并且该虚拟元素中的标签中包含一些值，则会发生此问题。因此，只需将标签值设置为''或null或未定义即可。它将起作用。

必需属性不与primeng <p-dropdown>一起使用

2 个答案: