javascript - tutorial - node js




AngularJS के साथ सर्वर मतदान (3)

आपको query लिए कॉलबैक में tick फ़ंक्शन को कॉल करना चाहिए।

function dataCtrl($scope, $timeout, Data) {
    $scope.data = [];

    (function tick() {
        $scope.data = Data.query(function(){
            $timeout(tick, 1000);
        });
    })();
};

मैं AngularJS सीखने की कोशिश कर रहा हूँ। हर दूसरे नए डेटा प्राप्त करने का मेरा पहला प्रयास:

'use strict';

function dataCtrl($scope, $http, $timeout) {
    $scope.data = [];

    (function tick() {
        $http.get('api/changingData').success(function (data) {
            $scope.data = data;
            $timeout(tick, 1000);
        });
    })();
};

जब मैं 5 सेकंड के लिए धागे को सोकर धीमा सर्वर अनुकरण करता हूं तो यह यूआई को अपडेट करने और एक और टाइमआउट सेट करने से पहले प्रतिक्रिया के लिए इंतजार कर रहा है। समस्या यह है कि जब मैं उपरोक्त को मॉड्यूल निर्माण के लिए कोणीय मॉड्यूल और डी का उपयोग करने के लिए पुनः लिखता हूं:

'use strict';

angular.module('datacat', ['dataServices']);

angular.module('dataServices', ['ngResource']).
    factory('Data', function ($resource) {
        return $resource('api/changingData', {}, {
            query: { method: 'GET', params: {}, isArray: true }
        });
    });

function dataCtrl($scope, $timeout, Data) {
    $scope.data = [];

    (function tick() {
        $scope.data = Data.query();
        $timeout(tick, 1000);
    })();
};

यह केवल तभी काम करता है जब सर्वर प्रतिक्रिया तेज हो। यदि कोई देरी हो रही है तो यह एक प्रतिक्रिया के इंतजार किए बिना एक दूसरे को अनुरोध करता है और यूआई को साफ़ करने लगता है। मुझे लगता है कि मुझे कॉलबैक फ़ंक्शन का उपयोग करने की आवश्यकता है। मैंने कोशिश की:

var x = Data.get({}, function () { });

लेकिन एक त्रुटि मिली: "त्रुटि: destination.push एक फ़ंक्शन नहीं है" यह $resource लिए दस्तावेज़ों पर आधारित था लेकिन मैं वास्तव में वहां के उदाहरणों को समझ नहीं पाया।

मैं दूसरा दृष्टिकोण कैसे काम करूं?


कोणीय के हाल के संस्करणों ने $interval पेश किया $interval जो सर्वर मतदान के लिए $timeout से भी बेहतर काम करता है।

var refreshData = function() {
    // Assign to scope within callback to avoid data flickering on screen
    Data.query({ someField: $scope.fieldValue }, function(dataElements){
        $scope.data = dataElements;
    });
};

var promise = $interval(refreshData, 1000);

// Cancel interval on page changes
$scope.$on('$destroy', function(){
    if (angular.isDefined(promise)) {
        $interval.cancel(promise);
        promise = undefined;
    }
});

हम इसे $ अंतराल सेवा का उपयोग करके आसानी से मतदान कर सकते हैं। यहां $ अंतराल के बारे में विस्तृत विवरण है
https://docs.angularjs.org/api/ng/service/$interval
$ अंतराल का उपयोग करने में समस्या यह है कि यदि आप $ http सेवा कॉलिंग या सर्वर परस्पर संपर्क कर रहे हैं और यदि आपके एक अनुरोध को पूरा करने से पहले $ अंतराल से अधिक समय में देरी हो जाती है, तो यह एक और अनुरोध शुरू करता है।
उपाय:
1. मतदान एक सामान्य या हल्के जेसन जैसे सर्वर से प्राप्त होने वाली सरल स्थिति होनी चाहिए, इसलिए आपके परिभाषित अंतराल के समय में अधिक समय नहीं लेना चाहिए। इस मुद्दे से बचने के लिए आपको अंतराल के समय को उचित रूप से परिभाषित करना चाहिए।
2. किसी भी तरह से यह किसी भी कारण से अभी भी हो रहा है, आपको वैश्विक ध्वज की जांच करनी चाहिए कि पिछले अनुरोध को समाप्त करने से पहले या कोई अन्य अनुरोध भेजने से पहले नहीं। यह उस समय अंतराल को याद करेगा लेकिन यह समय से अनुरोध नहीं भेजेगा।
इसके अलावा यदि आप थ्रेसहोल्ड वैल्यू सेट करना चाहते हैं कि किसी भी मूल्य के बाद मतदान मतदान किया जाना चाहिए तो आप इसे निम्नलिखित तरीके से कर सकते हैं।
यहां काम कर रहा उदाहरण है। here विस्तार से समझाया गया

angular.module('myApp.view2', ['ngRoute'])
.controller('View2Ctrl', ['$scope', '$timeout', '$interval', '$http', function ($scope, $timeout, $interval, $http) {
    $scope.title = "Test Title";

    $scope.data = [];

    var hasvaluereturnd = true; // Flag to check 
    var thresholdvalue = 20; // interval threshold value

    function poll(interval, callback) {
        return $interval(function () {
            if (hasvaluereturnd) {  //check flag before start new call
                callback(hasvaluereturnd);
            }
            thresholdvalue = thresholdvalue - 1;  //Decrease threshold value 
            if (thresholdvalue == 0) {
                $scope.stopPoll(); // Stop $interval if it reaches to threshold
            }
        }, interval)
    }

    var pollpromise = poll(1000, function () {
        hasvaluereturnd = false;
        //$timeout(function () {  // You can test scenario where server takes more time then interval
        $http.get('http://httpbin.org/get?timeoutKey=timeoutValue').then(
            function (data) {
                hasvaluereturnd = true;  // set Flag to true to start new call
                $scope.data = data;

            },
            function (e) {
                hasvaluereturnd = true; // set Flag to true to start new call
                //You can set false also as per your requirement in case of error
            }
        );
        //}, 2000); 
    });

    // stop interval.
    $scope.stopPoll = function () {
        $interval.cancel(pollpromise);
        thresholdvalue = 0;     //reset all flags. 
        hasvaluereturnd = true;
    }
}]);




angularjs