Nhiều tham số tùy chọn với ui-router góc

Question

Tôi đang cố gắng sử dụng nhiều thông số tùy chọn với ui-router nhưng có vẻ như không hoạt động. Dưới đây là các bài kiểm tra tôi đã làm:

tham số đơn là OK

state.url  url called  state param values 

/page/:x  /page/   $stateParams.x == "" 
/page/:x  /page/2  $stateParams.x == "2" 

Một tham số tùy chọn là OK

/page/:x?  /page/   $stateParams.x == "" 
/page/:x?  /page/2  $stateParams.x == "2" 

Hai thông số này là OK (trừ các dấu gạch chéo đôi xấu xí trong trường hợp đầu tiên, /page và /page/ biến thành /page//. Nhưng vì các tham số không phải là tùy chọn OK)

/page/:x/:y  /page//  $stateParams.x == "" && $stateParams.y == "" 
/page/:x/:y  /page/2  $stateParams.x == "" && $stateParams.y == "" 
/page/:x/:y  /page/2/  $stateParams.x == "2" && $stateParams.y == "" 
/page/:x/:y  /page/2/3  $stateParams.x == "2" && $stateParams.y == "3" 

Hai tham số tùy chọn hoạt động lạ. Tham số thứ hai luôn không xác định và nó không thể giải quyết tham số đầu tiên khi tôi chỉ định tham số thứ hai.

/page/:x?/:y? /page/   $stateParams.x == "" && $stateParams.y == undefined 
/page/:x?/:y? /page/2  $stateParams.x == "2" && $stateParams.y == undefined 
/page/:x?/:y? /page/2/  $stateParams.x == "" && $stateParams.y == undefined 
/page/:x?/:y? /page/2/3  $stateParams.x == "" && $stateParams.y == undefined 

Answer 1

Tham số tùy chọn UI-Router không được chỉ định bằng cách sửa đổi URL. Thay vào đó, chúng được xác định bằng cách sử dụng đối tượng params trong định nghĩa trạng thái.

Tuyên bố url: '/page/:x?/:y?' không đánh dấu x và y là thông số tùy chọn. Thay vào đó, dấu hỏi được sử dụng để tách URL và phần Tham số truy vấn của URL.

Đọc văn bản mô tả trong tài liệu UrlMatcher và tài liệu $stateProvider.state cho url, sau đó cho params.

Bạn sẽ kết thúc với params tùy chọn cấu hình như vậy:

$stateProvider.state('page', { 
    url: '/page/:x/:y', 
    params: { 
    x: 5, // default value of x is 5 
    y: 100 // default value of y is 100 
    } 
})