ko.mapping似乎破壞我的模型

我想使用一個接口，並根據WebAPI調用基於該接口（Model：IModel）填充類，該WebAPI調用返回.Net類結構。我的界面匹配結構，名稱和類型。ko.mapping似乎破壞我的模型

Knockout視圖模型代碼。

interface IReferenceItem { id：number; text：string; }

interface IModel { 
    ID: KnockoutObservable<number>; 
    HasPromotion: KnockoutObservable<boolean>; 
    DebtPaymentTypeId: KnockoutObservable<number>; 
    Description: KnockoutObservable<string>; 
    DueDayOfMonth: KnockoutObservable<number>; 
    OpeningBalance: KnockoutObservable<number>; 
    StandardRate: KnockoutObservable<number>; 
    MinimumMonthlyPercentage: KnockoutObservable<number>; 
    MinimumMonthlyPayment: KnockoutObservable<number>; 
    PromotionEndDate: KnockoutObservable<Date>; 
    PromotionalRate: KnockoutObservable<number>; 
} 

class DebtViewModel { 

    PaymentTypes: KnockoutObservableArray<IReferenceItem>; 
    DaysOfMonth: KnockoutObservableArray<IReferenceItem>; 

    LoadedState: KnockoutObservable<boolean> = ko.observable(false); 
    Model: IModel; 

    constructor() { 
     var self = this; 

     $.get("/api/debt/1") 
      .done((data) => { 
       self.Model = ko.mapping.fromJS(data); 
       console.debug(data); 
       console.debug(self.Model.Description()); 
       alert(self.Model.ID()); 
       self.LoadedState(true); 
      }); 


     this.PaymentTypes = ko.observableArray([{ "id": 1, "text": "Fixed Amount" }, { "id": 2, "text": "Percentage based" }]) 
     this.DaysOfMonth = ko.observableArray([{ "id": 1, "text": "1st" }, { "id": 2, "text": "2nd" }, { "id": 3, "text": "3rd" }]) 

     ko.computed(() => { 
      if (self.LoadedState()) { 
       alert(self.Model.ID()); 
      } 
     }); 
    } 

    save = function() { 
     alert("Save Model back to the POST API call...."); 
    } 
} 
ko.applyBindings(new DebtViewModel());

我試圖從API調用的數據映射，以我的模型類。

data，在api調用之後，具有有效數據。

但似乎在構造函數之外，this.Model總是'Undefined'。我認爲這是因爲我沒有正確初始化它（在Get之前）。

看來我的模型消失了......或者被改變了。

在行上，ko.mapping.fromJS(data, {}, this.Model);，this.Model未定義，如同後續行。

我在做什麼錯？

來源

2017-02-18 Craig

我相信你的意思是'ko.mapping.fromJS（數據，this.Model，這一點）;' –

數據是我從api調用獲得的模型，這是viewmodel，而this.Model是我想要保存所有我的ui數據的模型。我從視圖模型中分離出數據，這樣我就可以將它保存在保存中。所以我不這樣做是對的。 – Craig

在構造函數中聲明一個本地變量self，它將接收api調用的結果。

但是，在這個構造函數之外的任何地方，這個局部變量將不可訪問。參考this.Model將不會引用此局部變量，而是引用類屬性Model。

您已經在使用一個箭頭的功能，所以我想你可以試試這個：

class DebtViewModel { 

    ... 
    Model: IModel; 

    constructor() { 
     $.get("/api/debt/1") 
      .done((data) => { 
       this.Model = ko.mapping.fromJS(data); 
      }); 
     ... 
    } 

    save() { 
     var myModel = this.Model; 
     alert("Save Model back to the POST API call...."); 
    } 
}

來源

2017-02-20 06:54:52

ko.mapping似乎破壞我的模型

回答

相關問題