问题
This should be a very common problem, invoking an ng-model to parse the data into form (DOM) after which the modified checkbox's ng-checked will be translated back to data values so to be saved back on the server.
I have two check boxes respectively
<table><tbody>
<tr>
<td align="left">To be ignored</td><td align="left">Yes
<input type="checkbox" ng-model="nm_ignore" /></td>
<td></td>
</tr>
<tr>
<td align="left">To be excluded</td><td align="left">Yes
<input type="checkbox" ng-model="nm_exclude" /></td>
<td></td>
</tr>
</tbody>
</table>
And, my data is
$scope.nm_to_ignore = _a_record._ab_ignore; // "T"
$scope.nm_to_exclude = _a_record._ab_x_style; // "F"
My objective is :
I want a straight-forward easy way (easy-to-maintain codewise, which is, angularJS ng-model) to set the checkboxes CHECKED/UNCHECKED by the data read from the server. Also, I want to be able to save the values represented by CHECKED/UNCHECKED to the data just as it came.
回答1:
Checkbox objects in your DOM of your $scope. Notice I used attributes ng-true-value="'T'"
and ng-false-value="'F'"
to tell the translator to convert my CHECKED as the value "T" and UNCHECKED as "F" for data understood by my database to be stored on the server.
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="_assets/js-main/angular-1.5.8.min.js"></script>
<script src="_assets/JS-Main/angular-route-1.5.8.js"></script>
<!-- <..DOM..stuffs..> -->
<tr>
<td ><input type="checkbox" ng-model="nm_exclude"
ng-true-value="'T'" ng-false-value="'F'" /></td>
<td ><input type="checkbox" ng-model="nm_ignore"
ng-true-value="'T'" ng-false-value="'F'" /></td>
</tr>
Getting data from server -->
var A1 = angular.module('_mod_1', ['ngRoute', 'ngSanitize']);
A1.config(function ($locationProvider) {
$locationProvider.html5Mode(true);
});
A1.controller
('Controller',
function ($scope, $location, $http) {
angular.element(document)
.ready(function () {
$http.get(_endGet, config)
.success(function (serverdata, status, config) {
_a_record = serverdata;
/* lines of code */
$scope.nm_ignore = _a_record._ab_ignore; //"T"
$scope.nm_exclude = _a_record._ab_x_style; //"T"
});;
});
//Things to Do ...
}
);
Hope all the above helps you. Good luck! (Be mindful about the single-quote closure on your mapped value if it is non numeric: ng-true-value="'T'
", it will give you error if you left them out!)
来源:https://stackoverflow.com/questions/54450254/how-to-set-checkbox-ng-checked-from-server-data-using-angularjs-and-save-the-che