녹아웃 PureComputed 재발행시 가입자 호출

Question

데이터 세트가있는 양식이 있습니다. 집합 (또는 행)을 클릭하면 해당 데이터 집합으로 양식이 채워집니다.

각 세트마다 하나의 입력이 변경 될 때마다 데이터베이스를 갱신하는 pureComputed 오브젝트가 있습니다.

다른 설정을 클릭하면 pureComputed가 업데이트를 호출한다는 점을 제외하고는 정상적으로 작동합니다. 저는 이것이 생성자로 입력 세트를 구축했기 때문에 이것이 발생하지 않기를 기대합니다. 그래서 관찰 가능 항목과 각각의 pureComputed 속성을 대체합니다. 예를 들어

:

var Form = function (data) { 
    var $this = this; 
    $this.value1 = ko.observable(data.value1); 
    $this.value2 = ko.observable(data.value2); 
    $this.model = ko.pureComputed(function() { 
     return { 
      value1: $this.value1(), 
      value2: $this.value2(), 
     }; 
    }).extend({ updateModel: url }); 
}; 

//Inside some module 
var self = this; 
self.viewmodel = {}; 

var load = function (url) { 
    $.ajax({ 
     url: url, //etc 
    }).done(function (response) { 
     self.viewmodel.form(new Form(response)); 
    }); 
}; 
load('www.myapi.com/1'); 

var onClick = function() { 
    load('www.myapi.com/2'); 
}; 

는 또한, 업데이트 페이지로드에 호출되지 않습니다. 새 행을 클릭하면 왜 호출됩니까?

편집 : UpdateModel 코드 ...

ko.extenders.updateModel = function (target, options) { 
    var url = options; 

    target.subscribe(function (model) { 
     $.ajax({ 
      url: url, 
     }).done(function (response) { 
      /* not setting any observables */ 
     }); 
    }; 

    return target; 
}; 

편집 2은 : 위의 사실 내 코드에서 일하고있다. 나는 범인을 드롭 아웃을위한 녹아웃 바인딩으로 좁혔다.

각 양식의 일부는 드롭 다운입니다. 드롭 다운에 knockout의 기본 제공 바인딩을 사용하고 자리 표시자를 포함합니다. 드롭 다운 값이 null 또는 0이면 값이 서브 스크립 션을 호출합니다. 0보다 크면 괜찮습니다.

Answer 1

코드를 작성하여 실제 샘플 버전을 만들었습니다. 값을 변경하지 않으면 업데이트 기능이 실행되지 않습니다. 즉, "클릭"은 아무 것도 업데이트하지 않습니다.

ko.extenders.updateModel = function (target, options) { 
 
    var url = options; 
 

 
    target.subscribe(function (foo) { 
 
    console.log(url, foo); 
 
    }); 
 

 
    return target; 
 
}; 
 

 
var Form = function (data) { 
 
    var $this = this; 
 
    $this.value1 = ko.observable(data.value1); 
 
    $this.value2 = ko.observable(data.value2); 
 
    $this.model = ko.pureComputed(function() { 
 
    return { 
 
     value1: $this.value1(), 
 
     value2: $this.value2(), 
 
    }; 
 
    }).extend({ updateModel: data.url }); 
 
}; 
 

 
//Inside some module 
 
var vm = {}; 
 
vm.viewmodel = { 
 
    form: ko.observable() 
 
}; 
 

 
var counter = 0; 
 
var load = function (url) { 
 
    url = url + (++counter); 
 
    setTimeout(function() { 
 
    vm.viewmodel.form(new Form({ 
 
     value1: "1"+counter, 
 
     value2: "2"+counter, 
 
     url: url 
 
    })); 
 
    }, 100); 
 
}; 
 

 
load('www.myapi.com/'); 
 

 
vm.onClick = function() { 
 
    load('www.myapi.com/'); 
 
}; 
 

 
ko.applyBindings(vm);

<script src="https://cdnjs.cloudflare.com/ajax/libs/knockout/3.4.0/knockout-min.js"></script> 
 
<div data-bind="with: viewmodel.form"> 
 
    <input data-bind="value: value1"> 
 
    <input data-bind="value: value2"> 
 
</div> 
 
<button type="button" data-bind="click: onClick">click</button>