AngularJS形式表单 - 如何使单选按钮需要

我一直在寻找通过形式文档，以及通过SO，但我不能确定如果下面是可能的。有没有人遇到过解决方案？AngularJS形式表单 - 如何使单选按钮需要

问题：如何配置Formly Form单选按钮问题是必需的？

背景：我有一个API形式的问题返回到前端。例如，我可能会得到以下回：

这两个字段都是DB中的“必需”。如果我没有输入“什么是您的博客网址？”的答案，我会得到一个“必填字段”！信息。真棒。

但是如果我不填写那个单选按钮，我就不会收到这样的消息。当我点击“确认”时，表单就会挂起。

任何想法如何得到'这种形式是必需的！'无线电问题的消息？再次，这些问题不是硬编码的，所以它不像向HTML中添加选项那么简单。

是的，我试过使用required：true。与选择工作很好，但似乎与单选按钮无关。试试这个：

formlyConfigProvider.setType([{ 
name: 'radio', 
templateUrl: "radioTemplate.html", 
wrapper: ['simpleLabel', 'errorMessage'], 
defaultOptions: { 
    noFormControl: false 
}, 
apiCheck: function apiCheck(check) { 
    return { 
    templateOptions: { 
     required: true, 
     options: check.arrayOf(check.object), 
     labelProp: check.string.optional, 
     valueProp: check.string.optional 
    } 
    }; 
}, 
controller: ['$scope', 'HelpersService', function($scope, HelpersService) { 
    if (['Internet Explorer', 'MSIE', 'Unknown', 'Edge'].indexOf(HelpersService.getBrowserName().name) > -1) { 
    $scope.ieClass = 'ie'; 
    } 
}]

}]）;

我得到以下错误：

这使我相信这不是单选按钮的选项。但是，如果我错误地解释了这个错误，请让我知道！ :)

有人要求一个代码示例。代码库中的很多代码都是专有的;不过，我在下面列出了用于从数据库返回的问题的模板。我真正好奇的是，如果任何人之前遇到过这个问题，并且是否有文件配置选项来绕过它，或者是非常简单的黑客攻击。否则，我会考虑用控制器中的函数来检测这个。

****并非所有从数据库返回的问题都将是必需的！

<div ng-if="ctrl.questions"> 
 
    <form name="ctrl.form" ng-submit="ctrl.submit(ctrl.questions.model)" novalidate> 
 
     <formly-form form="ctrl.form" class="input" fields="ctrl.questions" model="ctrl.questions.model" > 
 
      <input type="submit" class="btn" id="submit" value="Confirm" /> 
 
     </formly-form> 
 
    </form> 
 
</div>

来源

2017-03-08 Kira Pilot

添加required的单选按钮：

<input type="radio" name="myRadio" required ng-model="myModel" value="myValue"/>

然后你可以使用NG-禁用检查是否选择了单选：

<input type="button" ng-click="action()" value="Next" ng-disabled="myform.myRadio.$invalid" />

来源

2017-03-08 16:49:06

感谢您的回复，但表格没有硬编码。相反，它是从数据库动态创建的。 –

由于您无法控制表单，因此您可以在js部分手动进行验证，然后将消息“注入”到对象中。 –

使用ng-required验证ch这样

<div ng-app="app" ng-controller="ctrl"> 
    <form name="myForm" ng-submit="submit()" > 
     <input type="radio" ng-model="roommate" value="roommate" ng-required="!roommate"> roommate <br/> 
     <button type="submit">Submit</button> 
     </form> 
</div>

Demo

来源

2017-03-08 16:50:19

感谢您的回复，但表单并未硬编码。相反，它是从数据库动态创建的。 –

发布代码示例 –

容易eckbox ......你添加所需的：在templateOptions如此。还有一个选项是禁用的。你甚至不打扰看网站上的任何例子吗？这可以很容易地找到这样做

{ 
    key: 'radiobutton1', 
    templateOptions: { 
     required: true, 
     label: 'Please make a selection', 
     options: [{value: 'Steak', id: 'steak'}, {value: 'Lobster', id: 'lobster'}] 
    } 
}

来源

2017-03-17 16:22:00 MattE

需要的示例：true我在文档中看到指的是type：input。是的，我试图将这个功能应用于单选按钮，但是当我这样做时，我得到'检查器不是函数'错误。我是初学者，可能会忽视某些内容，但我正在尝试在发布之前阅读文档。如果我的努力对你很恼人，你不必回答我的问题。 –

它对单选按钮的作用相同。确保它在templateOptions – MattE

谢谢。仍然看到提到的错误。已更新我的问题以更好地反映问题。 –

AngularJS形式表单 - 如何使单选按钮需要

回答

相关问题