ViewModel에서 관찰 할 수있는 자식

ko viewmodel의 일부 자식 속성에 문제가 있습니다. 자식 속성은 자동 완성으로는 관찰 할 수 없으므로 일부 새 (이 예제에서는) 폰트 번호를 추가 한 후에 UI /보기가 업데이트되지 않습니다. 자동 완성 기능을 위해 나는 rniemeyer의 knockout-jqAutocomplete를 사용합니다.ViewModel에서 관찰 할 수있는 자식

보기

<input data-bind="jqAuto: { source: searchCustomer, value: selectedCustomer, inputProp: 'Name', labelProp: 'Name', options: { delay: 250 } }" id="Customer_Name" name="Customer.Name" type="text" value=""> 

<div class="phone-list" data-bind="visible: selectedCustomer().PhoneNumbers.length > 0, foreach: selectedCustomer().PhoneNumbers"> 
    <input type="hidden" data-bind='attr: { name: "Customer.PhoneNumbers["+$index()+"].Id", value: Id}' /> 
    <input type="text" data-bind='attr: { name: "Customer.PhoneNumbers["+$index()+"].Number", value: Number}' /> 
</div>

function ViewModel(addressUrl) { 
    var $self = this; 

    $self.selectedCustomer = ko.observable(), 

    $self.searchCustomer = function (searchTerm, callback) { 
     $.ajax({ 
      url: '/customers/search/?query=' + encodeURIComponent(searchTerm), 
       cache: true, 
       dataType: "json" 
     }).done(callback); 
    } 

      $self.addPhoneNumber = function() { 
       $self.selectedCustomer().PhoneNumbers.push({ Id: 0, Number: '' }); 
      } 

      $self.removePhoneNumber = function (phoneNumber) { 
       $self.selectedCustomer().PhoneNumbers.remove(phoneNumber); 
      } 
}; 

var viewModel = new ViewModel(); 
ko.applyBindings(viewModel);

JSON 데이터 (결과)

{ 
    "Id":1, 
    "Name":"Test customer", 
    "PhoneNumbers":[ 
     { 
     "Number":"123456789", 
     "CreatedOnUtc":"/Date(1474299252213)/", 
     "Id":1 
     } 
    ] 
}

어떤 제안에 이거 해결해?

감사합니다.

종류와 관련,

플라미니

나는이 문제에 대한 fiddle 만든

UPDATE, 사람이를 해결 할 수 있습니까? 당신이 가진 유일한 관측이 selectedCustomer 경우

출처

2016-09-26 Flaminio

ko.mapping plugin (http://knockoutjs.com/documentation/plugins-mapping.html)을 사용하면 개체 구조를 관찰 할 수 있습니다. – TSV

ko.observable의 ko.mapping 결과에 아무런 의미가 없기 때문에 나는 당신을 올바르게 이해하고 있는지 잘 모르겠다. – Flaminio

이렇게하면 하위 속성을 관찰 할 수 있으므로 모델 변경 사항이 UI에 즉시 반영됩니다. – TSV

는 할 아마도 가장 쉬운 것은 당신이 PhoneNumbers로 변경할 때마다

$self.selectedCustomer.valueHasMutated();

를 호출하는 것입니다.

출처

2016-09-26 23:44:59

ViewModel에서 관찰 할 수있는 자식

답변

관련 문제