2014-10-20 11 views
1

我有以下的打字稿代碼時沒有更新:可觀察輸入輸入字段

///<reference path="typings/jquery/jquery.d.ts" /> 
///<reference path="typings/knockout/knockout.d.ts" /> 
///<reference path="typings/bootstrap/bootstrap.d.ts" /> 
///<reference path="typings/knockout.mapping/knockout.mapping.d.ts" /> 

class Municipality { 
    id: KnockoutObservable<number>; 
    name: KnockoutObservable<string>; 

    constructor(
      id: number, 
      name: string) { 

     this.id = ko.observable(id); 
     this.name = ko.observable(name); 
    } 
} 

class SettingsViewModel { 
    public municipality: KnockoutObservable<Municipality>; 

    constructor() { 
     this.municipality = ko.observable(new Municipality(0, "")); 
    } 

    editName = function (item) { 
     $('#editValueDialog').modal('show'); 
    } 

    submitUpdate = function() { 
     var data = ko.mapping.toJSON(this.municipality()); 
     console.log(data); 
    }; 
} 

$(document).ready(function() { 
    var serverData = JSON.parse($("#serverJSON").val()); 
    console.log(serverData); 
    vm.municipality(new Municipality(serverData.Id, serverData.Name)); 
}); 

var vm: SettingsViewModel; 
vm = new SettingsViewModel(); 
ko.applyBindings(vm); 

在我看來,我想只是有一個簡單的輸入字段:

<input type="text" data-bind="value: vm.municipality().name()"> 

值的名稱在輸入字段中可見,但在更改它並觸發submitUpdate事件時,該值沒有更改,在我檢查控制檯中的屬性時也沒有更改。

如果我輸入:

vm.municipality().name('test') 

在控制檯中值的變化。

我錯過了什麼?

回答

1

快速修復是使用vm.municipality()。name.valueHasMutated(),但它有點貌似已經somwhere出了錯結合..。也許把輸入字段內綁定的上下文,這樣就可以使財產以後像這樣:

<!-- ko with: vm.municipality --> 
    <input type="text" data-bind="value: name"> 
<!-- /ko --> 

不知道這個代碼將工作,很抱歉沒有TS編譯器和我沒有你的代碼轉換爲香草JS的時間。

希望一些這有助於

+0

其實好像這個工程。我很好奇,爲什麼?會再做幾次檢查。 – user373455 2014-10-21 07:58:48

+0

它可能工作,因爲綁定是困難的:P也許也試試這個: 2014-10-21 09:39:17

+0

我還沒有完全得到它,所以我不'不知道這是否有效,沒有jsfiddle,所以我不能測試(也懶得製作) – 2014-10-21 09:39:47

1
submitUpdate = function() { 
    var data = ko.mapping.toJSON(this.municipality()); 
    console.log(data); 
}; 

這裏使用箭頭功能 - 當submitUpdate被觸發這裏的this值可能是錯誤的,在運行時:

submitUpdate =() => { 
    var data = ko.mapping.toJSON(this.municipality()); 
    console.log(data); 
}; 
+0

正如我所見,這確實不會改變任何東西。我不認爲這是實際的submiitUpdate事件是錯誤的,因爲當我檢查控制檯時值沒有改變。那當然也有可能是錯的,但在其他地方也是錯的。 – user373455 2014-10-21 08:01:34