Arhn - архитектура программирования

Как установить флажок ng-checked из данных сервера с помощью AngularJS и сохранить проверенные/непроверенные данные обратно в данные сервера?

Это должно быть очень распространенной проблемой, вызывая ng-модель для анализа данных в форме (DOM), после чего измененный флажок ng-checked будет преобразован обратно в значения данных, чтобы быть сохраненными обратно на сервере.

У меня есть два флажка соответственно

<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>

И мои данные

$scope.nm_to_ignore = _a_record._ab_ignore; // "T"
$scope.nm_to_exclude = _a_record._ab_x_style; // "F"

Моя цель:
Мне нужен простой способ (простой в обслуживании с точки зрения кода, то есть модель angularJS ng) для установки флажков CHECKED/UNCHECKED по данным, считанным из сервер. Кроме того, я хочу иметь возможность сохранять значения, представленные CHECKED/UNCHECKED, в данные в том виде, в каком они были получены.

javascript checkbox angularjs angularjs-ng-model angularjs-ng-checked
30.01.2019

Ответы:


1

Объекты флажков в вашей DOM вашей $scope. Обратите внимание. Я использовал атрибуты ng-true-value="'T'" и ng-false-value="'F'", чтобы указать переводчику преобразовать мой CHECKED как значение "T" и UNCHECKED как "F" для данных, понятных моей базе данных, для хранения на сервере.

<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>

Получение данных с сервера -->

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 ...
    }
);

Надеюсь, все вышеперечисленное вам поможет. Удачи! (Помните о заключении одинарной кавычки в отображаемом значении, если оно не является числовым: ng-true-value="'T'", это выдаст вам ошибку, если вы их пропустите!)

30.01.2019
Новые материалы
Коллекции публикаций по глубокому обучению
Последние пару месяцев я создавал коллекции последних академических публикаций по различным подполям глубокого обучения в моем блоге https://amundtveit.com - эта публикация дает обзор 25..
Представляем: Pepita
Фреймворк JavaScript с открытым исходным кодом Я знаю, что недостатка в фреймворках JavaScript нет. Но я просто не мог остановиться. Я хотел написать что-то сам, со своими собственными..
Советы по коду Laravel #2
1-) Найти // You can specify the columns you need // in when you use the find method on a model User::find(‘id’, [‘email’,’name’]); // You can increment or decrement // a field in..
Работа с временными рядами спутниковых изображений, часть 3 (аналитика данных)
Анализ временных рядов спутниковых изображений для данных наблюдений за большой Землей (arXiv) Автор: Рольф Симоэс , Жильберто Камара , Жильберто Кейрос , Фелипе Соуза , Педро Р. Андраде ,..
3 способа решить квадратное уравнение (3-й мой любимый) -
1. Методом факторизации — 2. Используя квадратичную формулу — 3. Заполнив квадрат — Давайте поймем это, решив это простое уравнение: Мы пытаемся сделать LHS,..
Создание VR-миров с A-Frame
Виртуальная реальность (и дополненная реальность) стали главными модными терминами в образовательных технологиях. С недорогими VR-гарнитурами, такими как Google Cardboard , и использованием..
Демистификация рекурсии
КОДЕКС Демистификация рекурсии Упрощенная концепция ошеломляющей О чем весь этот шум? Рекурсия, кажется, единственная тема, от которой у каждого начинающего студента-информатика..