моделирование против getElementById

0

Я читаю книгу "Pro AngularJS" Адама Фримана, Аппресс.

Он создает приложение, которое является списком дел, и вы можете добавить свои собственные вещи в список. В части "Ответ на взаимодействие с пользователем", стр. 34

Вот модель

var model = {
  user: "Adam",
  items: [{ action: "Buy Flowers", done: false },
  { action: "Get Shoes", done: false },
  { action: "Collect Tickets", done: true },
  { action: "Call Joe", done: false }]
};

приложение

var todoApp = angular.module("todoApp", []);

контроллер

todoApp.controller("ToDoCtrl", function ($scope) {
  $scope.todo = model;
  $scope.addNewItem = function (actionText) {
    $scope.todo.items.push({ action: actionText, done: false });
  }
});

поле ввода

<input class="form-control" ng-model="actionText" />

и кнопка, которая добавляет новые вещи в модель

<button ng-click="addNewItem(actionText)">Add</button>

И затем он комментирует эту строку <input class="form-control" ng-model="actionText"/> (стр. 36)

Я указал имя свойства для директивы для обновления, которая не является частью модели. Директива ng-model будет динамически создавать свойство для меня в рамках контроллера, эффективно создавая динамические свойства модели, которые используются для обработки ввода пользователем.

Что он подразумевает под

создавая динамические свойства модели, которые используются для обработки ввода пользователя.

?

actionText ли мы новое свойство модели с именем actionText? , Мы добавляем "псевдо" "-property, чтобы контроллер мог использовать его для захвата входного значения?

Если это так, то зачем использовать ng-model="actionText" а не просто использовать простой старый getElementById? В конце концов, нам нужно только значение поля.

Может ли что-то вроде ng-click getElementById("myInput").value делает трюк, а также не добавляет ненужные вещи в модель?

благодаря

Теги:
angularjs-directive
angularjs-ng-model
angularjs-ng-click

1 ответ

0

Одна из особенностей angularjs состоит в том, чтобы максимально абстрагироваться от ручного манипулирования JavaScript DOM.

Представьте, что у вас 10 полей на форме и нужно делать getElementById...... Их гораздо проще в angularjs. Вам просто нужно иметь ng-модель в каждом типе ввода, а по вашим методам контроллера вы просто используете свою модель. Вам даже не нужно передавать их в качестве аргументов; метод на контроллере будет иметь доступ к модели.

Я думаю, что использование ng-модели в конечном итоге приведет к созданию более чистого кода, чем использование getElementById для доступа к каждому значению поля.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню