AngularJS JQuery的Ajax的表单提交等效 [英] AngularJS JQuery Ajax form submission Equivalent

问题描述

最近我跳进angularjs及其美妙至今。我一直在发送Ajax到$ http服务请求。今天，我很震惊地发现，有没有简单的方法来做到这一点（尽我所知）。通过谷歌和SO Seaching带我无处整块复杂的解决方案。

虽然我结束了使用JQuery现在，很好奇，如果像JQuery的AJAX技术，能够发送形式确实可用。下面是简单的jQuery code来说明什么是说

  $。阿贾克斯（{
           键入：POST，
           网址：formUrl，
           数据：FORMDATA，
           成功：函数（数据）
           {
                $ scope.form = $ sce.trustAsHtml（'＆LT; D​​IV CLASS =警报警报 - 成功＆GT;成功与Registred你会在5秒内被带回家＆LT;！/ DIV＆GT;'）;
                $超时（函数（）{
                    $ window.location.href =#home;
                }，10000）;
           }
         }）;
 

解决方案

有一个在角等效，这里是一个链接到的jsfiddle用一个例子来实现：的 http://jsfiddle.net/dmcquillan314/boo5tn62/

第11行的函数是如何发送请求到REST API的示例：

  $ scope.sendToResource =功能（）{}
 

要启用此功能，只需更改功能的指令指向该工厂将请求发送到配置在工厂API URL。

为了同一个API测试这一点，你就必须改变工厂，以配合您的服务器

这里有一些链接到相关文档：

https://docs.angularjs.org/api/ngResource/service/ $资源

https://docs.angularjs.org/api/ng/directive/ngSubmit

https://docs.angularjs.org/api/auto/service/ $提供

让我知道，如果有什么不清楚或者需要任何进一步的解释。这应该可以帮助您开始。

Lately I have jumped into angularjs and its wonderful so far. I have been sending AJAX requests through $http service. Today I was shocked to find that there is no simple way to do it (to the best of my knowledge). Seaching through google and SO took me nowhere with convoluted complex solution.

Though I ended up using JQuery for now, am curious if something like JQuery ajax, capable of sending form is really available. Here is simple JQuery code to illustrate what am talking about

$.ajax({
           type: "POST",
           url: formUrl,
           data: formData,  
           success: function(data)
           {
                $scope.form = $sce.trustAsHtml('<div class="alert alert-success">Succesfully Registred. You will be taken home in 5 seconds!</div>');
                $timeout(function(){
                    $window.location.href= "#home";
                }, 10000);
           }
         });

解决方案

There is an equivalent in angular, here is a link to a jsfiddle with an example implementation: http://jsfiddle.net/dmcquillan314/boo5tn62/

The function on line 11 is an example of how to send a request to a rest api:

$scope.sendToResource = function() {}

To enable this feature just change the function in the directive to point to this factory and it will send a request to the api url configured in the factory.

In order to test this with an api you'll have to change the factory to match your server

here are some links to relevant documentation:

https://docs.angularjs.org/api/ngResource/service/$resource

https://docs.angularjs.org/api/ng/directive/ngSubmit

https://docs.angularjs.org/api/auto/service/$provide

Let me know if anything is unclear or you require any further explanation. Hopefully this should help you get started.

这篇关于AngularJS JQuery的Ajax的表单提交等效的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！