AngularJS AJAX - $http

$http হল AngularJS-র একটি সেবা যা দূরস্থ সার্ভার থেকে ডাটা পড়ার জন্য ব্যবহৃত হয়

AngularJS $http

AngularJS $http সেবা সার্ভারের কাছে অনুরোধ জানায় এবং প্রতিক্রিয়া ফিরিয়ে দেয়

একক

সার্ভারের কাছে একটি সহজ অনুরোধ পাঠানো এবং শিরোমণ্ডলে ফলাফল দেখানো:

<div ng-app="myApp" ng-controller="myCtrl">
<p>আজকের স্বাগত বার্তা হল:</p>
<h1>{{myWelcome}}</h1>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope, $http) {
  $http.get("welcome.htm")
  .then(function(response) {
    $scope.myWelcome = response.data;
  });
});
</script>

স্বয়ংক্রিয়ভাবে প্রয়োগ করুন

পদ্ধতি

উপরোক্ত উদাহরণে $http সেবার .get পদ্ধতি。

.get পদ্ধতি $http সেবার একটি সহজ পদ্ধতি। নিম্নলিখিত সহজ পদ্ধতি রয়েছে:

• .delete()
• .get()
• .head()
• .jsonp()
• .patch()
• .post()
• .put()

উপরোক্ত পদ্ধতিরা প্রত্যেকটি $http সেবা কেমন ব্যবহার করা যায় তা দেখায়:

একক

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope, $http) {
  $http({
    method : "GET",
      url : "welcome.htm"
  }).then(function mySuccess(response) {
    $scope.myWelcome = response.data;
  }, function myError(response) {
    $scope.myWelcome = response.statusText;
  });
});

স্বয়ংক্রিয়ভাবে প্রয়োগ করুন

উপরোক্ত উদাহরণে, $http সেবা চালানোর জন্য একটি অবজেক্ট হিসাবে পারামিটার ব্যবহৃত হয়। এই অবজেক্ট এইচটিপি মেথড, URL, সফল হলে কর্মকাণ্ড এবং ব্যর্থ হলে কর্মকাণ্ড নির্দিষ্ট করে

বৈশিষ্ট্য

সার্ভার থেকে প্রাপ্ত প্রতিক্রিয়া হল নিম্নলিখিত বৈশিষ্ট্যসম্পন্ন অবজেক্ট:

• .config রিকোর্ড তৈরির জন্য ব্যবহৃত অবজেক্ট
• .data সেবায়োগ্য কোড বা অবজেক্ট, যা সার্ভার থেকে প্রতিক্রিয়া নিয়ে আসে
• .headers Function to get header information
• .status Define the numeric value of HTTP status
• .statusText Define the string of HTTP status

একক

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope, $http) {
  $http.get("welcome.htm")
  .then(function(response) {
    $scope.content = response.data;
    $scope.statuscode = response.status;
    $scope.statustext = response.statusText;
  });
});

স্বয়ংক্রিয়ভাবে প্রয়োগ করুন

To handle errors, send to .then Add a function to the method:

একক

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope, $http) {
  $http.get("wrongfilename.htm")
  .then(function(response) {
    // First function handles success
    $scope.content = response.data;
  }, function(response) {
    // Second function handles error
    $scope.content = "Something went wrong";
  });
});

স্বয়ংক্রিয়ভাবে প্রয়োগ করুন

JSON

The data obtained from the response should be in JSON format.

JSON is an excellent way to transfer data and is very easy to use in AngularJS or any other JavaScript.

উদাহরণ: আমাদের সার্ভারে একটি ফাইল আছে যা 15টি গ্রাহক ধারণকারী JSON অবজেক্ট ফিরিয়ে দেয়, এগুলো একটি নাম ' records এর আইন্দ্রণসমূহে

এখানে ক্লিক করে JSON অবজেক্ট দেখুন。

একক

The ng-repeat directive is perfect for looping through an array:

<div ng-app="myApp" ng-controller="customersCtrl">
<ul>
  <li ng-repeat="x in myData">
    {{ x.Name + ', ' + x.Country }}
  </li>
</ul>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
  $http.get("customers.php").then(function(response) {}}
    $scope.myData = response.data.records;
  });
});
</script>

স্বয়ংক্রিয়ভাবে প্রয়োগ করুন

অ্যাপ্লিকেশন বিবরণ:

এই অ্যাপ্লিকেশন দ্বারা নির্ধারিত customersCtrl কন্ট্রোলার scope এবং http অবজেক্ট

$http একটি XMLHttpRequest অবজেক্টবহির্ভূত ডাটা অনুরোধের জন্য ব্যবহৃত

$http.get() https://www.codew3c.com/angular/customers.php থেকে পড়া হয় JSON ডাটা。

সফল হলে, কন্ট্রোলার স্কোপে একটি অপেরেটর তৈরি করা হয় myDataযার মধ্যে সার্ভার থেকে JSON ডাটা আসে。