What is the Angular Equivalent for Jquery Ajax?

Question

$.ajax({
            type: "GET",
            url: "../Home/RightPanel",
            data:{"movie_name":$(".search_columns").val()},
            contentType: "application/json;charset=utf-8",
            success: function (res) {
               $("#right_panel").html(res);
            },
            error: function (xhr) {
                alert(xhr.responseText);
            }
        });

I tried using $http instead of $.ajax. But it didn't work.

inject $http in your controller or service. then try $http.get() — Vinay K, Feb 24 '15 at 11:48

score 1 · Answer 1 · edited Jun 20 '20 at 09:12

There is a whole section in the docs on how to use it:

The $http service is a core Angular service that facilitates communication with the remote HTTP servers via the browser's XMLHttpRequest object or via JSONP.

The $http service is a function which takes a single argument — a configuration object — that is used to generate an HTTP request and returns a promise with two $http specific methods: success and error.

Simple GET request example :

$http.get('/someUrl').
    success(function(data, status, headers, config) {
        // this callback will be called asynchronously
        // when the response is available
    }).
    error(function(data, status, headers, config) {
        // called asynchronously if an error occurs
        // or server returns response with an error status.
    });

Simple POST request example (passing data) :

$http.post('/someUrl', {msg:'hello word!'}).
    success(function(data, status, headers, config) {
        // this callback will be called asynchronously
        // when the response is available
    }).
    error(function(data, status, headers, config) {
        // called asynchronously if an error occurs
        // or server returns response with an error status.
  });

score 0 · Answer 2 · edited May 23 '17 at 12:20

It is not possible to send data in an $http GET request. You can either send you data as query string parameter or you can make a POST request. JQuery automatically converts the values in data in query string parameters.

GET request with query string parameter:

$http.get("../Home/RightPanel", 
{
params: { movie_name: $(".search_columns").val() }
});

You can find more examples at AngularJS passing data to $http.get request.

What is the Angular Equivalent for Jquery Ajax?

2 Answers2