Bộ định tuyến giao diện người dùng góc - cho phép ANY tham số chuỗi truy vấn

Question

Tôi đang sử dụng Bộ định tuyến giao diện người dùng góc và điều này hoạt động tốt trong hầu hết các trường hợp. Tuy nhiên, tôi có một tình huống mà tôi không biết tên của các tham số chuỗi truy vấn trước thời hạn.

Vì vậy, bình thường với bộ định tuyến UI bạn sẽ xác định một cái gì đó tuyến đường như thế này:

$stateProvider.state('test', { 
 
\t url: '/test?testQueryStringParam', 
 
\t templateUrl: 'Test.html', 
 
\t controller: 'TestController' 
 
});

Sau đó, trong bộ điều khiển của tôi, tôi có thể truy cập vào testQueryStringParam sử dụng $ stateParams.

Tuy nhiên, với bộ định tuyến giao diện người dùng, bạn không thể truy cập bất kỳ thông số chuỗi truy vấn nào không được chỉ định trong định nghĩa tuyến đường.

Bộ định tuyến đi kèm với khung công tác Góc, cho phép bạn thực hiện việc này. Vì vậy, tôi đã thử sử dụng dịch vụ vị trí $ với định tuyến bộ định tuyến UI của tôi. Điều này không hoạt động.

Khi tôi muốn thêm một tham số chuỗi truy vấn tôi sử dụng:

$location.search("paramName", "paramValue");

Khi tôi muốn nhận được các giá trị chuỗi truy vấn tôi chỉ sử dụng:

$location.search()

Điều này cập nhật URL, nhưng không khởi tạo lại bộ điều khiển (như $ state.go ($ state.current, {}, {reload: true}) sẽ). Điều này dường như không phải là một vấn đề lớn bởi vì tôi chỉ có thể tự tải lại dữ liệu. Tuy nhiên, nếu bạn sử dụng nút quay lại trong trình duyệt, một lần nữa nó sẽ thay đổi URL, nhưng không lặp lại bộ điều khiển.

Có anyway

1. tôi có thể có được điều này để làm việc chỉ sử dụng giao diện người dùng Router?

2. Nhận giải pháp thay thế bằng cách sử dụng $ location để thực sự khởi tạo lại bộ điều khiển.?

Như một phương sách cuối cùng tôi cũng đã thử hướng dẫn cập nhật window.location, nhưng điều này làm mới toàn bộ trang không được chấp nhận.

Cảm ơn

Answer 1

Bạn có thể vượt qua các thông số phi url không xuất hiện trong URL

$stateProvider.state('test', { 
    url: '/test?testQueryStringParam', 
    params: { 
    optParam: null, 
    }, 
    templateUrl: 'Test.html', 
    controller: 'TestController' 
}); 

Như bạn thấy, optParam là một tham số tùy chọn với giá trị mặc định null và sẽ không được hiển thị trong URL

bạn có thể truy cập vào param này trong điều khiển của bạn sử dụng $stateParams

$stateParams.optParam 

Dưới đây là một số hữu ích blog