KnockoutJS는 선택이

Question

이것은 선택이다 생성시기에 따라 예상치 못한 방법으로 관찰에 영향을 미치는 선택 :

 <div class="pull-left" data-bind="if: existingPackagingLevels().length > 0 && activateSelect() == true"> 
       <h4>Unique container</h4> 
       <select data-bind="enable: inUniqueContainerEditMode, 
            options: containers, 
           optionsText: function(container){ return container.name() + ' ' + container.type() }, 
           optionsValue: 'id', 
            value: existingPackagingLevels()[0].uniqueContainerId, 
          optionsCaption: '--Select--'"></select> 

       <button data-bind="visible: inUniqueContainerEditMode() == false, click: editUniqueContainer"><i class="icon-pencil"></i></button> 
       <button data-bind="visible: inUniqueContainerEditMode, click: saveNewUniqueContainer">save</button> 
       <button data-bind="visible: inUniqueContainerEditMode, click: cancelNewUniqueContainer">cancel</button> 
      </div> 

나는 아약스와 함께 existingPackagingLevels 변수를로드합니다. 배열의 첫 번째 요소에는 uniqueContainerId가 있거나 없을 수 있습니다. 선택한 컨테이너를 표시하려면 existingPackagingLevels [0] .uniqueContainerId()! = undefined 또는 "--Select--"옵션을 표시하십시오.

문제 :

<div class="pull-left" data-bind="if: existingPackagingLevels().length > 0"> 

이 선택은 기본적으로 덮어 내 existingPackagingLevels [0] .uniqueContainerId()하고 정의되지 않은 있습니다 : 나는 선택 만이 검사를 통과 한 후 생성 할 때. 그래서 다른 수표 "activateSelect() == true"를 추가하면 지연된 후에 true가 표시되기 시작합니다. 100ms의 지연으로 반 그리고 반 작동합니다. 시간의 절반은 값을 겹쳐 쓰며 정의되지 않은 값으로 설정하고 예상 한 시간의 절반 정도를 설정하여 uniqueContainerId에 해당하는 컨테이너를 표시합니다. 지연이 커지면 항상 작동합니다.

그럼 내가 속임수로 연기하지 않고 어떻게 작동 시키나요?

Answer 1

valueAllowUnset parameter을 사용해보십시오. 당신이 <select> 요소에 바인딩 값을 사용할 때

일반적으로, 그것은 는 관련 모델 값이 선택되어 <select>에있는 항목 설명 할 것을 의미한다. 그러나 모델 값을 목록에 해당 항목이없는 값으로 설정하면 어떻게됩니까? 기본 동작은 Knockout이 모델 값을 으로 덮어 쓰려면 드롭 다운에서 이미 선택된 항목으로 재설정하십시오. 따라서 은 모델과 UI가 동기화되지 않도록합니다.

그러나 때때로 그 동작을 원하지 않을 수도 있습니다. 대신 녹아웃을 사용하여 모델 관찰 가능이 에 해당 항목이없는 값을 취하도록 허용 한 경우 valueAllowUnset: true을 지정하십시오. 이 경우 모델 값을 <select>으로 나타낼 수 없을 때마다 그 시간은 시간에 선택된 값이 없으며 시각적으로 비어있는 것으로 표시됩니다. 사용자 이 나중에 드롭 다운에서 항목을 선택하면 보통 때처럼 모델에 기록됩니다.