AngularJS $ स्थान पथ परिवर्तित नहीं कर रहा है


126

फ़ॉर्म सबमिट होने के बाद मुझे पृष्ठ का URL बदलने में समस्या आ रही है।

यहाँ मेरे ऐप का प्रवाह है:

  1. रूट सेट किए गए हैं, URL को किसी फॉर्म पेज से पहचाना जाता है।
  2. पृष्ठ लोड, नियंत्रक सेट चर, निर्देश निकाल दिए जाते हैं।
  3. एक विशेष फॉर्म निर्देश को निकाल दिया जाता है जो AJAX का उपयोग करके एक विशेष फ़ॉर्म सबमिट करता है।
  4. AJAX के प्रदर्शन के बाद (Angular AJAX का ध्यान नहीं रखा जाता है) फिर कॉलबैक निकाल दिया जाता है और निर्देश उस $scope.onAfterSubmitफ़ंक्शन को कॉल करता है जो स्थान सेट करता है।

समस्या यह है कि स्थान निर्धारित करने के बाद कुछ नहीं होता है। मैं स्थान के /रूप में अच्छी तरह से परम स्थापित करने की कोशिश की है ... नहींं। मैंने फॉर्म जमा नहीं करने का भी प्रयास किया है। कुछ भी काम नहीं करता है।

मैंने यह देखने के लिए परीक्षण किया है कि क्या कोड onAfterSubmitफ़ंक्शन तक पहुंचता है (जो यह करता है)।

मेरा एकमात्र विचार यह है कि किसी तरह फंक्शन का दायरा बदल दिया जाता है (क्योंकि इसका निर्देश कहा जाता है), लेकिन फिर onAfterSubmitअगर स्कोप बदल जाए तो उसे कैसे कॉल किया जा सकता है ?

यहाँ मेरा कोड है

var Ctrl = function($scope, $location, $http) {
  $http.get('/resources/' + $params.id + '/edit.json').success(function(data) {
    $scope.resource = data;
  });

  $scope.onAfterSubmit = function() {
    $location.path('/').replace();
  };
}
Ctrl.$inject = ['$scope','$location','$http'];

क्या मेरी कोई मदद कर सकता है?



ध्यान रखें कि यह एक साल पहले बनाया गया था।
मात्सको

सही और एक अतिरिक्त वर्ष के लाभ के साथ, दूसरे के पास एक अधिक सटीक रूप से सही स्वीकृत उत्तर है।
जिम जी।

1
@JimG। यह कोई डुप्लिकेट नहीं है, यह प्रश्न 4 साल पहले है, जिसे आप लिंक करते हैं, 2 साल पहले है।
कास्त्रो रॉय

जवाबों:


298

मुझे कुछ दिन पहले भी इसी तरह की समस्या हुई थी। मेरे मामले में समस्या यह थी कि मैंने तृतीय पक्ष लाइब्रेरी (सटीक होने के लिए jQuery) के साथ चीजों को बदल दिया और इस मामले में भले ही कॉलिंग फ़ंक्शन और चर कार्यों को सेट करना हमेशा कोणीय पहचान नहीं करता है कि इस प्रकार परिवर्तन होते हैं यह कभी नहीं पचता है।

$ लागू () का उपयोग कोणीय ढांचे के बाहर से कोणीय में एक अभिव्यक्ति को निष्पादित करने के लिए किया जाता है। (ब्राउज़र डोम इवेंट्स, सेटटाइमआउट, एक्सएचआर या थर्ड पार्टी लाइब्रेरी से उदाहरण के लिए)।

$scope.$apply()स्थान बदलने के बाद सही उपयोग करने की कोशिश करें और replace()कोणीय को यह बताने के लिए बुलाया जाए कि चीजें बदल गई हैं।


1
एक जादू की तरह काम करता है। मैंने इसे पोस्ट करने के लिए आपके द्वारा उपयोग किए गए कोड को काम करने के लिए जोड़ा है :) बहुत बहुत धन्यवाद !!!
matsko

4
$ $ कोणीय के साथ कैसे काम करता है और इसके मुद्दों के आसपास कैसे काम करना है, इसका एक बेहतर विचार प्राप्त करने के लिए, यहां उस वर्ष के लिए एक लिंक है www.ofmoo.com/2012/10/…
matsko

2
@ स्केटर आप बस रूट स्कोप को इंजेक्ट कर सकते हैं और इस तरह काम कर सकते हैं: फैक्ट्री ('xyz', ['$ rootScope', फंक्शन ($ rootScope) {...}])
F Lekschas

4
$ टाइमआउट के साथ अपने कॉलबैक को लपेट सकते हैं और गुंजाइश ठीक से लागू होगी
जेसन

7
जैसे जेसन ने कहा, $ टाइमआउट (फ़ंक्शन () {// यहां परिवर्तन लागू करें}) का उपयोग करें; इसके दो फायदे हैं: 1) आपको $ गुंजाइश की आवश्यकता नहीं है। 2) आप $ लागू alredy के बारे में चिंता करने की जरूरत नहीं है। 2 कारण के लिए, $ टाइमआउट का उपयोग करना अक्सर पसंदीदा तरीका होता है।
ArneHugo

56

$location.path(...)पृष्ठ को बदलने या ताज़ा करने के बजाय , मैंने सेवा का उपयोग किया $window। कोणीय में इस सेवा का उपयोग windowऑब्जेक्ट के इंटरफेस के रूप में किया जाता है , और windowऑब्जेक्ट में एक संपत्ति होती है locationजो आपको स्थान या URL सामान से संबंधित संचालन को संभालने में सक्षम बनाती है।

उदाहरण के लिए, window.locationआप इस तरह एक नया पृष्ठ असाइन कर सकते हैं:

$window.location.assign('/');

या इसे ताज़ा करें, इस तरह:

$window.location.reload();

इसने मेरे लिए काम किया। यह आपकी अपेक्षा से थोड़ा अलग है लेकिन दिए गए लक्ष्य के लिए काम करता है।


3
मुझे भी, $ location.path () url के पास जब अनुप्रेषण अनुप्रेषित नहीं करता है
सुधाकर

2
यह सही जवाब है। यहां
इरविंग

28

मुझे भी यही समस्या थी, लेकिन $ $ स्थान पर मेरा फोन एक पचाने के भीतर ही था। कॉलिंग $ लागू () बस एक $ पचाने में पहले से ही प्रक्रिया त्रुटि है।

इस चाल ने काम किया (और $locationअपने नियंत्रक में इंजेक्ट करना सुनिश्चित करें ):

$timeout(function(){ 
   $location...
},1);

हालांकि कोई विचार नहीं है कि यह क्यों आवश्यक था ...


5
नहीं, यह एक बुरा विचार है। बस चरण चरण की जांच करें कि यह एक पचाने के भीतर है और फिर आप आवेदन को छोड़ सकते हैं। कोणीय इसे पकड़ लेगा और अपने आप URL बदल देगा: coderwall.com/p/ngisma
matsko

3
टाइमआउट मुझे एक गंदे हैक की तरह लगता है। यदि आपके href में "#" है, तो $ location.path () अपेक्षित रूप से काम नहीं करता है। बस अपने टैग पर पूरी तरह से href = "#" निकालें या बस href = "" पर सेट करें और आपको $ timeout का उपयोग करने की आवश्यकता नहीं होगी
शंकर ARUL - jupyterdata.com

7
$ $ चरण एक निजी चर है जिसे आपको एक्सेस करने का प्रयास नहीं करना चाहिए क्योंकि यह एक नए कोणीय संस्करण में बदल सकता है।
ब्लेज़

7
$ टाइमआउट का उपयोग करना हैक हो सकता है, लेकिन $ $ चरण का उपयोग करना और भी बड़ा हैक है। आम तौर पर, $ $ के साथ उपसर्ग किए गए किसी भी चीज़ को देखने या स्पर्श न करें।
nilskp

3
लगभग 10 घंटे की यादृच्छिक चीजों को तोड़ने के बाद ... इस समाधान ने मेरे लिए काम किया!
शकील

6

मुझे अपना $location.path()स्टेटमेंट इस तरह एंबेड करना था क्योंकि मेरा डाइजेस्ट अभी भी चल रहा था:

       function routeMe(data) {                
            var waitForRender = function () {
                if ($http.pendingRequests.length > 0) {
                    $timeout(waitForRender);
                } else {
                    $location.path(data);
                }
            };
            $timeout(waitForRender);
        }

1
समारोह के लिए धन्यवाद, बहुत उपयोगी!
बिल एफ्फिन मरे

मेरे लिए समस्या यह थी कि हम कोणीय-ब्लॉक-यूआई का उपयोग कर रहे थे और यह पता बार स्थान के अद्यतन को रोक रहा था। हमने $ http अनुरोध को एक बूल के साथ सजाया था जिसे हमारे अनुरोधफिल्टर ने उठाया ताकि ब्लॉक-यूआई उस विशेष कॉल पर ट्रिगर न हो, और फिर सब कुछ ठीक था।
माताओ

2

मेरे मामले में, मेरे टेम्पलेट कॉन्फ़िगरेशन में समस्या वैकल्पिक पैरामीटर संकेतक ('?') गायब थी।

उदाहरण के लिए:

.when('/abc/:id?', {
    templateUrl: 'views/abc.html',
    controller: 'abcControl'
})


$location.path('/abc');

पूछताछ चरित्र के बिना मार्ग स्पष्ट रूप से मार्ग पैरामीटर को दबाने से नहीं बदलेगा।


यह टेम्पलेट कॉन्फ़िगरेशन है, लेकिन मार्ग कॉन्फ़िगरेशन है।
पिओटर डोब्रोगोस्ट

1

यदि आप में से कोई भी कोणीय-यूआई / यूआई-राउटर का उपयोग कर रहा है, तो $state.go('yourstate')इसके बजाय : का उपयोग करें $location। इसने मेरे लिए चाल चली।


0

यह मेरे लिए (कॉफी क्राफ़्ट में)

 $location.path '/url/path'
 $scope.$apply() if (!$scope.$$phase)

0

मेरी राय में यहाँ कई उत्तर थोड़े हैक किए गए लगते हैं (जैसे $ लागू () या $ टाइमआउट), क्योंकि $ लागू होने () के साथ गड़बड़ करने से अवांछित त्रुटियां हो सकती हैं।

आमतौर पर, जब $ स्थान काम नहीं करता है तो इसका मतलब है कि कुछ कोणीय तरीके से लागू नहीं किया गया था।

इस विशेष प्रश्न में, समस्या गैर-कोणीय AJAX भाग में प्रतीत होती है। मेरे पास एक अनुकरणीय समस्या थी, जहां $ ठिकाने का उपयोग करने का पुनर्निर्देशन एक वादा हल होने के बाद होना चाहिए। मैं इस उदाहरण पर समस्या का उदाहरण देना चाहूंगा।

पुराना कोड:

taskService.createTask(data).then(function(code){
            $location.path("task/" + code);
        }, function(error){});

नोट: taskService.createTask एक वादा लौटाता है।

$ q - वादों का उपयोग करने का कोणीय तरीका:

let dataPromises = [taskService.createTask(data)];
        $q.all(dataPromises).then(function(response) {
                let code = response[0];
                $location.path("task/" + code);
            }, 
            function(error){});

वादा को हल करने के लिए $ q का उपयोग करके पुनर्निर्देशन समस्या को हल किया गया।

$ Q सेवा पर अधिक: https://docs.angularjs.org/api/ng/service/ $ q


-8
setTimeout(function() { $location.path("/abc"); },0);

इसे आपकी समस्या का समाधान करना चाहिए।


1
एक गैर-सेटटाइमआउट चलाना बहुत बुरा विचार है। और, जैसा कि @matsko ने ऊपर कहा, $ टाइमआउट सबसे अच्छा विचार नहीं है।
गोन्ज़ोफिश
हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.