我对角度相对较新，我试图绑定我的表单单选按钮，以便将数据发布到后端。
我的问题是当我尝试提交表单时，变量formData不包含表单中输入的任何信息。我尝试在简单的文本输入上绑定ng-repeat以外的方法，并且它有效。
这是我的HTML
<section ng-app="IrsTestFactor">
<div ng-controller="IrsController as IrsCtrl">
<h2>
The IRS 20-Factor Test
<span id="loading" ng-show="isProcessing">
<span>
-
<img src="@Url.Content("~/Content/img/ajax-loader.gif")" alt="loading..." />
Processing please wait
</span>
</span>
</h2>
<section class="content-indent">
<p ng-show="emptyModel">Error - model is empty </p>
<form ng-submit="processForm()" ng-hide="IRSCtrl.emptyModel">
<br />
<div ng-class="alertClass" class="alert" role="alert" id="alert" ng-show="alert">
{{alertMessage}}
</div>
<br />
<div class="jumbotron well well-lg">
<p>
Please answer the questions below. The IRS developed this 20-Factor test to determine if a business controls and directs a worker, or has a right to do so. The factors (questions), applied to
each individual circumstance under which services are to be performed, determine the individual's classification. The questions must be objectively and consistently applied in order to determine the
individual's correct status. If the predominance of answers to the 20 questions is "yes", the individual is most likely an employee. If the predominance of answers is "no", the individual is most
likely an independent contractor.
</p>
</div>
<br /><br />
<div ng-repeat="question in questionnaire">
<div class="btn-group col-xs-offset-1 col-xs-2 col-sm-2" data-toggle="buttons">
<span class="btn btn-primary">
<input type="radio" name="item_{{$index}}" ng-model="$parent.formData" value="false"> No
</span>
<span class="btn btn-primary">
<input type="radio" name="item_{{$index}}" ng-model="$parent.formData" value="true"> Yes
</span>
</div>
<span class="message col-xs-8 col-sm-8">{{question.QuestionPhrase}}</span>
<br /><br /><br />
</div>
<input type="text" ng-model="formData.word" name="word" />
<div class="centered-panel-btn">
<a type="button" href="/@ContractManagerConfig.RootUrl()/Home/" class="btn btn-default">
<span class="glyphicon glyphicon-arrow-left" aria-hidden="true"></span>
Cancel
</a>
<button type="submit" class="profile-savenext btn btn-success" value="next">
<span class="glyphicon glyphicon-ok" aria-hidden="true"></span>
Submit
</button>
</div>
</form>
</section>
</div>
这是我的角色：
var app = angular.module('IrsTestFactor', []);
app.controller('IrsController', function ($scope, $http) {
$scope.isProcessing = false;
$scope.alert = false;
$scope.alertClass = "";
$scope.alertMessage = "";
$scope.formData = {};
$scope.emptyModel = false;
/** Http request to get all questions for the irs questionnaire [caching] */
$http({
method : 'GET',
cache : true,
url : 'GetQuestionnaire'
}).success(function (data) {
$scope.questionnaire = data.QuestionnaireList;
$scope.emptyModel = false;
}).error(function () {
alert("error");
$scope.emptyModel = true;
});
$scope.processForm = function () {
$scope.isProcessing = true;
formData = JSON.stringify($scope.formData);
alert(formData);
$http({
method : 'POST',
url : 'SaveIRSFactorTest',
data : $scope.formData, // pass in data as strings
headers : { 'Content-Type': 'application/x-www-form-urlencoded' } // set the headers so angular passing info as form data (not request payload)
})
.success(function(data) {
$scope.alert = false;
$('html, body').animate({ scrollTop: 0 }, 'slow');
if (!data.success) {
$scope.alertClass = "alert-danger";
$scope.alertMessage = data.message;
$scope.isProcessing = false;
$scope.alert = true;
} else {
//success
$scope.alertClass = "alert-success";
$scope.alertMessage = data.message;
$scope.alert = true;
}
$scope.alert = true;
})
.error(function (data) {
$scope.alert = false;
$('html, body').animate({ scrollTop: 0 }, 'slow');
$scope.alertClass = "alert-danger";
$scope.alertMessage = data.message;
$scope.isProcessing = false;
$scope.alert = true;
});
}
});
答案 0 :(得分：0)
$parent.formData应该是范围内的属性。将其设置为空对象ng-repeat将不起作用。此外，您在 <div ng-repeat="question in questionnaire">
<div class="btn-group col-xs-offset-1 col-xs-2 col-sm-2" data-toggle="buttons">
<span class="btn btn-primary">
<input type="radio" name="item_{{$index}}" ng-model="formData['item_' + $index]" value="false"> No
</span>
<span class="btn btn-primary">
<input type="radio" name="item_{{$index}}" ng-model="formData['item_' + $index]" value="true"> Yes
</span>
</div>
<span class="message col-xs-8 col-sm-8">{{question.QuestionPhrase}}</span>
<br /><br /><br />
</div>
内有单选按钮，因此您必须根据项目索引生成模型。尝试这样的事情。
string[] digits = FourDigitNum.Split();
答案 1 :(得分：0)
事实证明问题来自跨度。我将它们更改为标签并且有效。
以下是代码：
<div ng-repeat="question in questionnaire">
<div class="btn-group col-xs-offset-1 col-xs-2 col-sm-2" data-toggle="buttons">
<label class="btn btn-primary">
<input type="radio" name="question{{$index}}" ng-model="formData[$index]" value="false"> No
</label>
<label class="btn btn-primary">
<input type="radio" name="question{{$index}}" ng-model="formData[$index]" value="true"> Yes
</label>
</div>
{{formData}}
<span ng-bind="question.QuestionPhrase" class="message col-xs-8 col-sm-8"></span>
<br /><br /><br />
</div>