JS loại bỏ: kiểm tra sự tồn tại của một quan sát được trong một liên kết IF

Question

Tôi đang hiển thị một khối HTML tương tự cho một số đối tượng hơi khác nhau. Họ là 90% giống nhau, nhưng mỗi người có một số quirks cụ thể mà yêu cầu quan sát thêm. Tôi muốn hiển thị từng mục tương tự trong một khối mẫu, nhưng tôi đang gặp sự cố với các đối tượng không xác định.

Về cơ bản, tôi muốn kiểm tra sự tồn tại của một đối tượng quan sát được trước khi hiển thị đối tượng đó trong mẫu.

Tôi cố gắng để làm một cái gì đó như thế này:

<div data-bind="foreach: blocks"> 
<h2 data-bind="text: normalHeader"><h2> 
<p data-bind="text: normalText"></p> 
<!-- ko if: specialText --><p data-bind="text: specialText"></p><!-- /ko --> 
</div> 

Vì vậy, nếu specialText không tồn tại (không chỉ là không có giá trị, nhưng không tồn tại ở tất cả) cho rằng lặp của blocks, bỏ qua có điều kiện. Các lỗi tôi nhận được là:

Uncaught Error: Unable to parse bindings. 
Message: ReferenceError: specialText is not defined; 

Từ những gì tôi hiểu của Knockout của "nếu" ràng buộc, nó phải làm việc nếu đối tượng trả về bất kỳ loại giá trị giả như thế nào, như null hoặc không xác định, có nghĩa là nếu ràng buộc nên duyên dáng thất bại, mà nó chắc chắn không phải là.

Có cách nào để thực hiện công việc này không?

Answer 1

Bạn có thể sử dụng phương pháp sau đây:

<!-- ko foreach: Items --> 
    <strong data-bind="text: Foo"></strong> 
    <br /> 
    <!-- ko if: $data.hasOwnProperty("Bar") --> 
     <p data-bind="text: Bar"></p> 
    <!-- /ko --> 
<!-- /ko -->​ 

Tôi đã đăng một working demo

Answer 2

thử điều này:

<!-- ko if: specialText != null --> 

ko sẽ nhận ra nó như là một biểu chứ không phải là một giá trị và vì vậy nó nên công việc như bạn muốn :)

Answer 3

<!-- ko if: typeof specialText != 'undefined' -->

Dựa trên giải pháp Oybek, bạn cũng có thể làm:

<!-- ko foreach: Items --> 
    <strong data-bind="text: Foo"></strong> 
    <br /> 
    <!-- ko if: "Bar" in $data --> 
     <p data-bind="text: Bar"></p> 
    <!-- /ko --> 
<!-- /ko -->​ 

Ví dụ: http://jsfiddle.net/MecNx/56/

Answer 4

Bạn có thể làm điều đó bằng cách truy cập thông qua indexer của đối tượng:

<!-- ko foreach: Items --> 
 
    <strong data-bind="text: Foo"></strong> 
 
    <br /> 
 
    <!-- ko if: $data["Bar"] --> 
 
     <p data-bind="text: Bar"></p> 
 
    <!-- /ko --> 
 
<!-- /ko -->