JSFiddle:http://jsfiddle.net/c6tzj6Lf/4/
我正在动态创建表单和按钮,并且如果未完成所需的表单输入,则要禁用按钮.
HTML:
<div ng-app="choicesApp">
<ng-form name="choicesForm" ng-controller="ChoicesCtrl">
<div ng-bind-html="trustCustom()"></div>
<button ng-repeat="button in buttons" ng-disabled="choicesForm.$invalid">
{{button.text}}
</button>
</ng-form>
</div>
Run Code Online (Sandbox Code Playgroud)
JavaScript的:
angular.module('choicesApp', ['ngSanitize'])
.controller('ChoicesCtrl', ['$scope', '$sce', function($scope, $sce) {
$scope.custom = "Required Input: <input required type='text'>";
$scope.trustCustom = function() {
return $sce.trustAsHtml($scope.custom);
};
$scope.buttons = [
{text:'Submit 1'},
{text:'Submit 2'}];
}]);
Run Code Online (Sandbox Code Playgroud)
choicesForm.$invalidfalse在输入字段中输入文本时是和不会改变.
解:
我最终使用了angular-bind-html-compile指令:https://github.com/incuna/angular-bind-html-compile
以下是工作代码的相关内容:
<ng-form name="choicesForm">
<div ng-if="choices" bind-html-compile="choices"></div>
<button ng-click="submitForm()" ng-disabled="choicesForm.$invalid">
Submit
</button>
</ng-form>
Run Code Online (Sandbox Code Playgroud)
选择可能是像这样的HTML的snippit:
<div><strong>What is your sex?</strong></div>
<div>
<input …Run Code Online (Sandbox Code Playgroud)