Как сообщить AngularJS, что форма была заполнена извне с помощью jQuery? - PullRequest
0 голосов
/ 22 декабря 2018

У меня есть страница в AngularJS, в которой есть форма, содержащая некоторые поля.После загрузки этой страницы я хочу закладку, которая при щелчке заполняет поля на основе данных в файле конфигурации.Используется файл JS, который использует jquery для заполнения данных в форме

Когда я делаю $("#id").val('abcd'), поле заполняется текстом abcd, но angularjs считает, что форма все еще недействительна. Классыng-pristine ng-invalid все еще остаются на элементе.Я попытался удалить с помощью jquery removeClass() и добавить классы ng-dirty ng-valid, используя addClass(), но состояние формы все еще остается недействительным.

Как сообщить angularjs, что поля формы заполненыа форма действительна?

Ответы [ 2 ]

0 голосов
/ 23 декабря 2018

Контроллер ng-model прослушивает событие 'change'.

<input id="id" ng-model="$ctrl.text" />

Чтобы запустить его из jQuery:

$("#id").val("abcd").trigger("change");

Это установит значение входа и триггера.ngModelController для обновления модели в рамках AngularJS.

DEMO

$(function() {
  $("#bt").on("click", function() {
    $("#id").val("abcd").trigger("change");
  });
})
<script src="//unpkg.com/jquery"></script>
<script src="//unpkg.com/angular/angular.js"></script>
<body ng-app>
    <input id="id" ng-model="$ctrl.text" /><br>
    text={{$ctrl.text}}<br>
    <button id="bt">Click me</button>
</body>

Примечание

Важно загрузить библиотеку jQuery до библиотеки AngularJS.

Из документов:

Чтобы использовать jQuery, просто убедитесь, что он загружен до файла angular.js.

Для получения дополнительной информации см. AngularJS Angular.element API Reference .

0 голосов
/ 22 декабря 2018

Звоните $ применяются после ввода данных.

$scope.$apply()

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

Из Документов

$ apply () используется для выполнения выражения в AngularJS извне платформы AngularJS.(Например, из событий DOM браузера, setTimeout, XHR или сторонних библиотек).Поскольку мы обращаемся к платформе AngularJS, нам необходимо выполнить надлежащий жизненный цикл области обработки исключений, выполняя наблюдения.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...