ตำแหน่ง AngularJS $ ไม่เปลี่ยนเส้นทาง

ฉันมีปัญหาในการเปลี่ยน 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'];

ใครช่วยฉันหน่อยได้ไหม

ฉันมีปัญหาคล้าย ๆ กันเมื่อหลายวันก่อน ในกรณีของฉันปัญหาคือฉันเปลี่ยนสิ่งต่าง ๆ ด้วยไลบรารีของบุคคลที่สาม (jQuery เพื่อให้แม่นยำ) และในกรณีนี้แม้ว่าฟังก์ชันการโทรและตัวแปรการตั้งค่าจะทำงาน Angular ไม่ได้รับรู้เสมอไปว่ามีการเปลี่ยนแปลงดังนั้นจึงไม่สรุป

$ apply () ใช้เพื่อดำเนินการนิพจน์ในเชิงมุมจากภายนอกกรอบเชิงมุม (ตัวอย่างเช่นจากเหตุการณ์ DOM ของเบราว์เซอร์ setTimeout, XHR หรือไลบรารีของบุคคลที่สาม)

ลองใช้$scope.$apply()ทันทีหลังจากที่คุณเปลี่ยนสถานที่และโทรreplace()แจ้งให้ Angular รู้ว่ามีการเปลี่ยนแปลง

แทนการเปลี่ยนแปลงหรือรีเฟรชหน้าผมใช้บริการ$location.path(...) $windowใน Angular บริการนี้ใช้เป็นส่วนต่อประสานกับwindowออบเจ็กต์และwindowอ็อบเจ็กต์มีคุณสมบัติlocationที่ช่วยให้คุณสามารถจัดการการดำเนินการที่เกี่ยวข้องกับตำแหน่งหรือเนื้อหา URL

ตัวอย่างเช่นwindow.locationคุณสามารถกำหนดหน้าใหม่ได้ดังนี้:

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

หรือรีเฟรชเช่นนี้:

$window.location.reload();

มันได้ผลสำหรับฉัน แตกต่างจากที่คุณคาดหวังเล็กน้อย แต่ใช้ได้ผลตามเป้าหมายที่กำหนด

ฉันมีปัญหาเดียวกันนี้ แต่การโทรไปยัง $ location นั้นอยู่ในอีเมลสรุปแล้ว การโทรไปที่ $ apply () ทำให้ $ Digest เกิดข้อผิดพลาดในกระบวนการ

เคล็ดลับนี้ใช้ได้ผล (และอย่าลืมฉีด$locationเข้าไปในคอนโทรลเลอร์ของคุณ):

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

แม้ว่าจะไม่รู้ว่าทำไมถึงจำเป็น ...

ฉันต้องฝัง$location.path()คำสั่งของฉันแบบนี้เพราะไดเจสต์ของฉันยังทำงานอยู่:

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

ในกรณีของฉันปัญหาคือตัวบ่งชี้พารามิเตอร์ทางเลือก ('?') หายไปในการกำหนดค่าเทมเพลตของฉัน

ตัวอย่างเช่น:

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


$location.path('/abc');

หากไม่มีอักขระสอบสวนเส้นทางจะไม่เปลี่ยนการระงับพารามิเตอร์เส้นทางอย่างชัดเจน

หากมีใครใช้ Angular-ui / ui-router ให้ใช้: $state.go('yourstate')แทนการใช้$location. มันเป็นเคล็ดลับสำหรับฉัน

สิ่งนี้สำหรับฉัน (ใน CoffeeScript)

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

ในความคิดของฉันคำตอบหลายคำที่นี่ดูเหมือนจะแฮ็คเล็กน้อย (เช่น $ apply () หรือ $ timeout) เนื่องจากการยุ่งกับ $ apply () อาจทำให้เกิดข้อผิดพลาดที่ไม่ต้องการได้

โดยปกติแล้วเมื่อ $ location ไม่ทำงานหมายความว่ามีบางอย่างไม่ได้ใช้งานในลักษณะเชิงมุม

ในคำถามนี้ปัญหาดูเหมือนจะอยู่ในส่วน AJAX ที่ไม่ใช่เชิงมุม ฉันมีปัญหาที่คล้ายกันซึ่งการเปลี่ยนเส้นทางโดยใช้ $ location ควรเกิดขึ้นหลังจากคำสัญญาได้รับการแก้ไข ฉันต้องการอธิบายปัญหาในตัวอย่างนี้

รหัสเก่า:

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

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

ควรแก้ปัญหาของคุณ