AngularJS - Как мне отправить форму контроллеру на сервере?

#javascript #form-submit #angularjs

#javascript #форма-отправить #angularjs

Вопрос:

Примеры форм cookbook на сайте AngularJS сохраняют состояние только на клиенте. Как мне отправить форму на сервер?

В качестве альтернативы, как мне использовать jQuery form.submit() для формы в ng:click="save()" функции?

Редактировать — Найдено 2 способа сделать это (я также удалил HTML-разметку, которую вставил ранее — просто обратитесь к примеру advanced form cookbook для источника)

http://webpac2.rot13.org:3000/conference/Work (автор: Добрика Павлинусич) пойти по пути AngularJS, используя ресурс для отправки данных на сервер в формате JSON. У меня были проблемы с этим на стороне сервера — AngularJS отправлял ее нормально, но grails искажал ее (в соответствии с firebug и длиной содержимого запроса). Мне нужно изучить это подробнее. Как мне изменить тип содержимого в angular для такого метода ресурсов, как $save() ?
Поместите форму и используйте кнопку отправки. Поскольку я не создаю одностраничное веб-приложение, я использовал этот метод. Большинство проверок было на клиенте и еще несколько на сервере, чего для меня было достаточно.

Просто помещаю это здесь, чтобы кто-то другой мог использовать это для возможных решений и наилучшего подхода.

1. Можете ли вы показать свою текущую разметку и код? Повторите ваш PS: это, возможно, так же плохо, как могло бы быть и хорошо…

2. @marcel — неправильно отрисовал мою копипасту. Я надеюсь, вы сможете извлечь из этого смысл. Ценю вашу помощь

3. Можете ли вы показать HTML-разметку по мере ее отправки в браузер (используйте ‘View Source’), чтобы нам не приходилось выяснять, как будет выглядеть результирующий HTML. В конце концов, это то, что увидит JavaScript.

Ответ №1:

Обратите внимание, существует строгое разделение представления (вашего html-шаблона) и логики (вашего JS-кода) — в основном из-за возможности тестирования.

Правильный способ — просто отправить вашу модель на сервер, используя $resource (для REST) или низкоуровневый $ http. Вместо выполнения задания в шаблоне.

Простой пример — HTML шаблон

 First: <input type="text" ng-model="person.first" />
Last: <input type="text" ng-model="person.last" />
<button ng:click="save()">Save</button>

JavaScript — контроллер

 function FormCntl($scope, $http) {
  $scope.save = function() {
    $http.put('/save.py', $scope.person);
  };
}

1. если я использую this.save = function... , это не сработает. Я должен использовать $scope.save = function... в контроллере.

2. @Voles спасибо, обновлен до текущего синтаксиса версии v1 (ответ был написан в 0.9.* синтаксис)

3. Когда я сбрасываю запрос на стороне сервера, ничего не отправляется. Это пустой массив: Log::write(print_r($_REQUEST,true))

4. @itcouldevenbeaboat вам нужно обернуть это в <form> тег, тогда кнопка будет вызвана при вводе.

5. @PineappleUndertheSea не уверен, в чем проблема в вашем случае, но попробуйте console.log($scope.person) , прежде чем отправлять ее на сервер…

Ответ №2:

Насколько я знаю, на самом деле не существует хорошего способа изменить заголовки, которые angular отправляет ожидаемому серверу для редактирования исходного кода angular. Это запланированное улучшение, но оно все еще не сделано.

Я думаю, что angular Google Group может быть лучшим местом для того, чтобы задавать конкретные вопросы, подобные этому, поскольку разработчики действительно дружелюбны и хорошо осведомлены.