Cách chính xác để sử dụng loại tham số "bool" với ui-router là gì?

Question

Tôi đã cố gắng sử dụng các loại param với ui-router và dường như không thể làm cho chúng đúng.

$stateProvider.state({ name: 'home.foo', url: '/foo/{isBar:bool}', controller: function() { }, templateUrl: 'foo.html' });

kỳ vọng của tôi là tôi sẽ có thể chuyển sang trạng thái như thế này:

$state.go(home.foo, { isBar: false })

hoặc

ui-sref="home.foo({ isBar: false })"

tuy nhiên trong kết quả $ stateParams bạn sẽ thấy isBar: true

Nhìn vào cách 'bool' param type is written Tôi giả sử đúng/sai phải được mã hóa là 0/1 trên url nhưng điều này không xảy ra. Nếu sử dụng 0/1 trong params cho $ state.go thì nó hoạt động và được giải mã là false/true nhưng để làm rối loạn thêm vấn đề, điều này không hoạt động nếu sử dụng ui-sref.

Hy vọng điều này plunker sẽ giải thích tốt hơn. Bất kỳ gợi ý nào được đánh giá cao!

Edit: Mục tiêu của tôi trong việc sử dụng các loại bool param là để kết thúc với một kiểu dữ liệu boolean trong $ stateParams

Answer 1

Vì vậy, sau khi đào bới xung quanh nhiều file tôi thấy lý do tại sao hai cách cuối cùng (0,1) don' t làm việc trong ui-sref. Có cuộc gọi này tại dòng 106 của stateDirectives.js: newHref = $state.href(ref.state, params, options);

này sẽ trả về null trong trường hợp sử dụng 1 và 0. Và kể từ khi các cuộc gọi trên được tiếp theo này:

if (newHref === null) { 
     nav = false; 
     return false; 
    } 

một liên kết là không bao giờ làm. Bây giờ, lý do null được trả về. state.href gọi urlRouter.href. Bên trong đó là một cuộc gọi để xác nhận các thông số. Xác thực là: result = result && (isOptional || !!param.type.is(val));

khi bạn nhìn vào hàm là bool (is: function(val) { return val === true || val === false; }), bạn có thể thấy lý do lỗi này bằng 1 và 0 không đúng hoặc sai. Theo ý kiến ​​của tôi nó cũng nên kiểm tra 1 và 0 nếu đó là những gì nó cuối cùng được chuyển đổi nhưng ít nhất bây giờ bạn biết lý do tại sao nó cư xử theo cách nó.

Answer 2

Có một loại updated and working plunker with boolean tùy chỉnh

Trong trường hợp này, chúng tôi muốn làm việc với một bool như chủng loại, trong đó hy vọng và chấp nhận:

true, false , 0, 1

chúng tôi chỉ phải đăng ký kiểu tùy chỉnh của chúng tôi:

app.config(['$urlMatcherFactoryProvider', function($urlMatcherFactory) { 

    $urlMatcherFactory.type('boolean', 
    // our type custom type 
    { 
    name : 'boolean', 
    decode: function(val) { return val == true ? true : val == "true" ? true : false }, 
    encode: function(val) { return val ? 1 : 0; }, 
    equals: function(a, b) { return this.is(a) && a === b; }, 
    is: function(val) { return [true,false,0,1].indexOf(val) >= 0 }, 
    pattern: /bool|true|0|1/ 
    }) 

}]); 

Và sau đó chúng ta có thể sử dụng url defintion này bên trong của bất cứ tiểu bang:

... 
, url: '/foo/{isBar:boolean}' 
... 

Chú ý: tại sao boolean? không phải bool? Bởi vì bool đã được đăng ký cho 0|1 như xa như tôi nhớ

Kiểm tra nó here

ORIGINAL

giải pháp đơn giản làm việc với "chuỗi" in this updated plunker,

... // states definitions 
, url: '/foo/{isBar:(?:bool|true|0|1)}'