AngularJS এর ​​সাথে কীভাবে nch http সিঙ্ক্রোনাস কল

Question

অ্যাঙ্গুলারজেএস-এর সাথে সিঙ্ক্রোনাস কল করার কোনও উপায় আছে কি?

অ্যাঙ্গুলারজেএস ডকুমেন্টেশন কিছু প্রাথমিক জিনিসগুলি বের করার জন্য খুব স্পষ্ট বা বিস্তৃত নয়।

একটি পরিষেবাতে:

myService.getByID = function (id) {
    var retval = null;

    $http({
        url: "/CO/api/products/" + id,
        method: "GET"
    }).success(function (data, status, headers, config) {

        retval = data.Data;

    });

    return retval;
}

Comments

অ্যাসিক্রোনাস আচরণটি কীভাবে মোকাবেলা করতে হবে সে সম্পর্কে কিছু ধারণার জন্য গ্রুপগুলি জিডও / ডি / টপিক / ম্যাঙ্গুলার / ক্যাগজএক্সএক্সএইচএস_ভি / ডিসকশন দেখুন : ইভেন্টস, $ সার্ভার সাইডে প্রিলোড, $ http থেকে ফিরে আসা প্রতিশ্রুতিটি ব্যবহার করুন।

— মার্ক রাজকক

অ্যাসিঙ্ক্রোনাস সর্বদা ভাল, বিশেষত যখন আপনার প্রতিশ্রুতি থাকে।

— অ্যান্ড্রু জোসলিন

অনেক সময়, আপনি সিঙ্ক্রোনাস কলগুলি এড়াতে পারেন। কীভাবে $ রিসোর্সগুলি স্ট্যাকওভারফ্লো . com/ প্রশ্নগুলি 111166662/ … কাজ করে ।

— হনজাজদে

@ অ্যান্ড্রু জসলিন অ্যাসিনক্রোনাস যখন আপনার অর্ডার করা ডেলিভারি প্রয়োজন তখন আরও খারাপ।

— স্টিজন ভ্যান অ্যান্টওয়ার্পেন

Answer 1

এখন না. আপনি যদি সোর্স কোডটি দেখুন (অক্টোবর ২০১২ এর এই সময়ে থেকে) , আপনি দেখতে পাবেন যে এক্সএইচআর খোলার কলটি আসলে অ্যাসিঙ্ক্রোনাস হিসাবে শক্ত কোডড (তৃতীয় প্যারামিটারটি সত্য):

 xhr.open(method, url, true);

আপনার নিজের পরিষেবাটি লিখতে হবে যা সিঙ্ক্রোনাস কল করেছিল। সাধারণত এটি এমন কিছু নয় যা আপনি সাধারণত জাভাস্ক্রিপ্ট কার্যকরকরণের প্রকৃতির কারণে করতে চান আপনি অন্য সমস্ত কিছু অবরুদ্ধ করে শেষ করবেন।

... তবে .. যদি অন্য সমস্ত কিছু অবরুদ্ধ করা প্রকৃতপক্ষে পছন্দসই হয়, তবে আপনার প্রতিশ্রুতি এবং $ q পরিষেবাটি সন্ধান করা উচিত । এটি আপনাকে অ্যাসিক্রোনাস ক্রিয়াকলাপ না করা পর্যন্ত অপেক্ষা করতে দেয় এবং তারপরে কিছু শেষ হয়ে গেলে কিছু সম্পাদন করে। আপনার ব্যবহারের ক্ষেত্রে কী তা আমি জানি না, তবে এটি একবার দেখার মতো।

এর বাইরে যদি আপনি নিজের রোল করতে চলেছেন তবে কীভাবে সিঙ্ক্রোনাস এবং অ্যাসিঙ্ক্রোনাস এজ্যাক্স কল করবেন সে সম্পর্কে আরও তথ্য এখানে পাওয়া যাবে ।

আমি আশা করি যে সহায়ক।

Comments

আপনি কি $ q পরিষেবাটি ব্যবহার করে স্নিপেট কোডটি সন্ধান করতে পারেন? আমি অনেকগুলি বিকল্প চেষ্টা করেছিলাম তবে এটি একটি অ্যাসিনক্রোনাস পদ্ধতিতে কাজ করছে।

— ভেঙ্কট

এমন জায়গাগুলি রয়েছে যেখানে এটি উপলব্ধি করতে পারে, উদাহরণস্বরূপ যখন ব্যবহারকারী ব্রাউজারটি বন্ধ করে দেয় (অন্বেতনলোড), আপনি যদি সংরক্ষণ করতে চান তবে আপনাকে একটি সিঙ্ক অনুরোধ পাঠাতে হবে, অন্য একটি বিকল্পটি একটি ডায়ালগ বাতিল দেখানো, এবং তারপরে উইন্ডোটি পুনরায় চালু করতে হবে?

— ব্র্যালিও

@ ভেনক্যাট: আমি জানি এটি একটি দেরি করা জবাব, তবে আমি যেমন উত্তরে বলেছি, কলটি সর্বদা "অবিচ্ছিন্ন" থাকবে আপনার প্রতিক্রিয়াটির জন্য অপেক্ষা করার জন্য আপনাকে কেবল $ কিউ ব্যবহার করতে হবে , তারপরে আপনার যুক্তিটি ভিতরে চালিয়ে যেতে হবে .then(callback)। ভালো কিছু: doSomething(); $http.get('/a/thing').then(doEverythingElse);।

— বেন লেশ

নিম্নলিখিত ভিডিওটি আমাকে প্রতিশ্রুতিগুলি অধ্যয়ন করতে সহায়তা করেছে অ্যাঙ্গুলারজেএস প্রতিশ্রুতি $ কিউ

— ইলিয়া পালকিন

@ বেনল্যাশ আপনি যে সময়টি রেখেছিলেন বা যে সময়টি ofুকিয়ে দেয় সে সম্পর্কে আমি কৃতজ্ঞ নই। আমি আপনার উত্তরটি নিখরচায় ভোগ করতে পারি এবং বলতে পারি যে কোনও উদাহরণ দেওয়া থাকলে তা আমার পক্ষে সহায়ক হত। আমি আপনার উত্তরটি দেখেছি, এটি আমার কোনও উপকারে আসে না, তাই আমি এটিকে ভোট দিয়ে ট্যাবটি বন্ধ করে দিয়েছিলাম এবং গুগলে ফিরে গিয়ে আমার পক্ষে আরও সহায়ক বলে একটি উত্তর খুঁজতে চেষ্টা করেছি। কেউ যখন আপনার উত্তরটিকে কম ভোট দেয় এবং এটি আপনাকে কীভাবে উন্নত করা যায় তা আপনাকে জানায় এটি পৃথিবীর শেষ নয়। আপনি কেন নীচে ভোট দিতে পছন্দ করতেন কেন এ সম্পর্কে কোনও মন্তব্য না রেখে? ন্যায়বান থাকবে.

— সার্কিট্রি

Answer 2

আমি গুগল ম্যাপের স্বতঃপূরণ এবং প্রতিশ্রুতি দিয়ে একত্রিত একটি কারখানার সাথে কাজ করেছি, আশা করি আপনি পরিবেশন করবেন।

http://jsfiddle.net/the_pianist2/vL9nkfe3/1/

আপনাকে কেবল এই অনুরোধ দ্বারা স্বয়ংক্রিয়রূপে পরিসেবা প্রতিস্থাপন করতে হবে $ http কারখানার আগে থাকা ইনকিডা।

app.factory('Autocomplete', function($q, $http) {

এবং $ http অনুরোধের সাথে

 var deferred = $q.defer();
 $http.get('urlExample').
success(function(data, status, headers, config) {
     deferred.resolve(data);
}).
error(function(data, status, headers, config) {
     deferred.reject(status);
});
 return deferred.promise;

<div ng-app="myApp">
  <div ng-controller="myController">
  <input type="text" ng-model="search"></input>
  <div class="bs-example">
     <table class="table" >
        <thead>
           <tr>
              <th>#</th>
              <th>Description</th>
           </tr>
        </thead>
        <tbody>
           <tr ng-repeat="direction in directions">
              <td>{{$index}}</td>
              <td>{{direction.description}}</td>
           </tr>
        </tbody>
     </table>
  </div>

'use strict';
 var app = angular.module('myApp', []);

  app.factory('Autocomplete', function($q) {
    var get = function(search) {
    var deferred = $q.defer();
    var autocompleteService = new google.maps.places.AutocompleteService();
    autocompleteService.getPlacePredictions({
        input: search,
        types: ['geocode'],
        componentRestrictions: {
            country: 'ES'
        }
    }, function(predictions, status) {
        if (status == google.maps.places.PlacesServiceStatus.OK) {
            deferred.resolve(predictions);
        } else {
            deferred.reject(status);
        }
    });
    return deferred.promise;
};

return {
    get: get
};
});

app.controller('myController', function($scope, Autocomplete) {
$scope.$watch('search', function(newValue, oldValue) {
    var promesa = Autocomplete.get(newValue);
    promesa.then(function(value) {
        $scope.directions = value;
    }, function(reason) {
        $scope.error = reason;
    });
 });

});

প্রশ্নটি নিজেই তৈরি করা উচিত:

deferred.resolve(varResult); 

আপনি যখন ভাল কাজ করেছেন এবং অনুরোধটি করেছেন:

deferred.reject(error); 

যখন কোনও ত্রুটি হয় এবং তারপরে:

return deferred.promise;

Answer 3

var EmployeeController = ["$scope", "EmployeeService",
        function ($scope, EmployeeService) {
            $scope.Employee = {};
            $scope.Save = function (Employee) {                
                if ($scope.EmployeeForm.$valid) {
                    EmployeeService
                        .Save(Employee)
                        .then(function (response) {
                            if (response.HasError) {
                                $scope.HasError = response.HasError;
                                $scope.ErrorMessage = response.ResponseMessage;
                            } else {

                            }
                        })
                        .catch(function (response) {

                        });
                }
            }
        }]


var EmployeeService = ["$http", "$q",
            function ($http, $q) {
                var self = this;

                self.Save = function (employee) {
                    var deferred = $q.defer();                
                    $http
                        .post("/api/EmployeeApi/Create", angular.toJson(employee))
                        .success(function (response, status, headers, config) {
                            deferred.resolve(response, status, headers, config);
                        })
                        .error(function (response, status, headers, config) {
                            deferred.reject(response, status, headers, config);
                        });

                    return deferred.promise;
                };

Answer 4

আমি সম্প্রতি এমন একটি পরিস্থিতিতে ছুঁড়েছি যেখানে আমি কোনও পৃষ্ঠা পুনরায় লোড দ্বারা ট্রিগার হওয়া $ HTTP কল করতে চেয়েছিলাম। আমি যে সমাধানটি দিয়েছিলাম:

1. দুটি কলকে ফাংশনে আবদ্ধ করুন
2. দ্বিতীয় function http কলকে দ্বিতীয় ফাংশনে কলব্যাক হিসাবে পাস করুন
3. অ্যাপনে দ্বিতীয় ফাংশন কল করুন। সাফল্য

Comments

লুপের জন্য যদি এটি হয় তবে এন টাইম সার্ভারের সাথে।

— মিথুন

Answer 5

এখানে এটি এমন একটি উপায় যা আপনি এটি অবিচ্ছিন্নভাবে করতে পারেন এবং আপনার মতো সাধারণভাবে পরিচালনা করতে পারেন। এখনও সবকিছু ভাগ করা আছে। আপনি যে অবজেক্টটি আপডেট করতে চান তার একটি রেফারেন্স পাবেন। আপনি যখনই এটি আপনার পরিষেবায় আপডেট করেন তখন তা প্রতিশ্রুতি না দেখে বা ফিরে না পেয়ে বিশ্বব্যাপী আপডেট হয়। এটি সত্যিই দুর্দান্ত কারণ আপনি পুনরায় ফেরত না দিয়েই পরিষেবার মধ্যে থেকে অন্তর্নিহিত অবজেক্টটি আপডেট করতে পারেন। এঙ্গুলারটি যেভাবে ব্যবহার করা উচিত তা ব্যবহার করে। আমি মনে করি এটি সম্ভবত idea http.get / post সিঙ্ক্রোনাস করা খারাপ ধারণা। আপনি স্ক্রিপ্টে একটি লক্ষণীয় বিলম্ব পাবেন।

app.factory('AssessmentSettingsService', ['$http', function($http) {
    //assessment is what I want to keep updating
    var settings = { assessment: null };

    return {
        getSettings: function () {
             //return settings so I can keep updating assessment and the
             //reference to settings will stay in tact
             return settings;
        },
        updateAssessment: function () {
            $http.get('/assessment/api/get/' + scan.assessmentId).success(function(response) {
                //I don't have to return a thing.  I just set the object.
                settings.assessment = response;
            });
        }
    };
}]);

    ...
        controller: ['$scope', '$http', 'AssessmentSettingsService', function ($scope, as) {
            $scope.settings = as.getSettings();
            //Look.  I can even update after I've already grabbed the object
            as.updateAssessment();

এবং কোথাও একটি দৃশ্যে:

<h1>{{settings.assessment.title}}</h1>

Answer 6

যেহেতু সিঙ্ক এক্সএইচআরটিকে অবমূল্যায়ন করা হচ্ছে, তাই নির্ভর করা ভাল না best আপনার যদি একটি সিঙ্ক পোস্টের অনুরোধ করতে হয় তবে আপনি কোনও ফর্ম পোস্ট অনুকরণ করতে কোনও পরিষেবার অভ্যন্তরে নিম্নলিখিত সহায়কগুলি ব্যবহার করতে পারেন।

এটি লুকানো ইনপুটগুলি সহ একটি ফর্ম তৈরি করে যা নির্দিষ্ট ইউআরএলে পোস্ট করা হয় তা নিয়ে কাজ করে।

//Helper to create a hidden input
function createInput(name, value) {
  return angular
    .element('<input/>')
    .attr('type', 'hidden')
    .attr('name', name)
    .val(value);
}

//Post data
function post(url, data, params) {

    //Ensure data and params are an object
    data = data || {};
    params = params || {};

    //Serialize params
    const serialized = $httpParamSerializer(params);
    const query = serialized ? `?${serialized}` : '';

    //Create form
    const $form = angular
        .element('<form/>')
        .attr('action', `${url}${query}`)
        .attr('enctype', 'application/x-www-form-urlencoded')
        .attr('method', 'post');

    //Create hidden input data
    for (const key in data) {
        if (data.hasOwnProperty(key)) {
            const value = data[key];
            if (Array.isArray(value)) {
                for (const val of value) {
                    const $input = createInput(`${key}[]`, val);
                    $form.append($input);
                }
            }
            else {
                const $input = createInput(key, value);
                $form.append($input);
            }
        }
    }

    //Append form to body and submit
    angular.element(document).find('body').append($form);
    $form[0].submit();
    $form.remove();
}

আপনার প্রয়োজনের জন্য প্রয়োজনীয় হিসাবে সংশোধন করুন।

Answer 7

কোনও Promise.all()পদ্ধতিতে যেমন আপনার কল মোড়ানো সম্পর্কে কী

Promise.all([$http.get(url).then(function(result){....}, function(error){....}])

এমডিএন অনুসারে

প্রতিশ্রুতি। সমস্ত প্রত্যাশার জন্য অপেক্ষা (বা প্রথম প্রত্যাখ্যান)

Comments

আপনি কি বিষয়ে কথা হয়? একাধিক প্রতিশ্রুতি নিয়ে প্রশ্নের কোনও

— যোগসূত্র নেই

এটি এক বা একাধিক প্রতিশ্রুতি পূর্ণ হওয়ার জন্য অপেক্ষা করবে!

— মনজিৎ দোসন্ধ

এটি কীভাবে কাজ করে তা দেখতে আপনি এটি ব্যবহার করেছেন? Promise.all অন্য প্রতিশ্রুতি ফিরে আসবো, এটি সিঙ্ক কল মধ্যে ASYNC রুপান্তর না

— Ovidiu Dolha

হুম ... এমডিএন ডকুমেন্টেশনগুলি দ্ব্যর্থক হতে পারে বলে মনে হয় ... এটি তাদের ডকুমেন্টেশনে যেমন বলেছে ঠিক ততক্ষণ অপেক্ষা করে না।

— মনজিৎ দোসন্ধের

তাই আপনাকে স্বাগতম। মানের উত্তর সরবরাহ করার জন্য দয়া করে এই কীভাবে উত্তরটি পড়ুন।

— ওয়েওয়েওয়েরে