淘汰賽映射響應對象

我有像這樣的一個用戶對象：淘汰賽映射響應對象

var userModel = { 
    Id: ko.observable(), 
    Email: ko.observable().extend({ email: true, required: true, maxLength: 200 }), 
    FirstName: ko.observable().extend({ required: true, minLength: 2, maxLength: 200 }), 
    LastName: ko.observable().extend({ required:true, minLength: 2, maxLength: 200 }), 
    DefaultLanguage: ko.observable(), 
    Phone: ko.observable().extend({phoneUS:true}), 
    AvatarUrl: ko.observable(), 
    Claims: ko.observableArray() 
};

我加載的響應，並希望到對象的響應綁定。響應與模型的格式完全相同：

self.user = userModel; 
self.loadData = function (params) { 
     $.get('/api/user/' + params.id).then(function (data) { 
      console.log('GET User', data); 
      self.user.Id(data.Id); 
      self.user.Email(data.Email); 
      self.user.FirstName(data.FirstName); 
      self.user.LastName(data.LastName); 
      self.user.Phone(data.Phone); 
      self.user.DefaultLanguage(data.DefaultLanguage); 
      self.user.AvatarUrl(data.AvatarUrl); 
      self.user.Claims(data.Claims); 
     }); 
    };

雖然上面的工作很棒，但它真的很長。有沒有更簡單的方法來綁定對象？

來源

2016-01-29 allencoded

你可以用 'ko.mapping.fromJS（）'（http://knockoutjs.com/documentation/plugins-mapping.html） –

嘗試，它並沒有self.user工作是不是功能。 – allencoded

這不起作用？ ko.mapping.fromJS（data，{}，self.user）; –

您可以使用JavaScript反射

$.get('/api/user/' + params.id).then(function (data) { 
      for(var i in data){ 
       if(data.hasOwnProperty(i) && self.user.hasOwnProperty(i)) 
       { 
         self.user[i](data[i]); 
       } 
      } 
     });

這可以被轉移到函數，使事情更容易。當你有可觀察對象的嵌套結構以及可觀察屬性和標準屬性的組合時，它會變得更加複雜。但基於你的例子，這將工作。

另外。 ko.mapping.fromJS會起作用，但有時候會很痛苦。

來源

2016-01-29 21:25:28 QBM5

我喜歡用的圖案是水合物/再水合物。 Here is a codepen證明了這一點。

var User = function(init) { 
    var self = this; 
    self.firstName = ko.observable(); 
    self.lastName = ko.observable(); 
    self.city = ko.observable(); 

    this.update = function(data) { 
    data = data || {}; 
    Object.keys(data).forEach(function(key) { 
     self[key](data[key]); 
    }); 
    } 
    this.update(init); 
}

這允許任何人都可以輕鬆地進行更新，因爲必要時可以提供儘可能多的屬性。

setTimeout(function() { 
    user.update({ 
    firstName: 'Tim', 
    lastName: 'Moran', 
    city: 'Portland' 
    }) 
}, 2000)

但是，如果在很多模型上完成，這可能會變得單調乏味，因此您可以將其拉入基本模型。

var baseViewModel = { 
    update: function(data) { 
    data = data || {}; 
    var self = this; 
    Object.keys(data).forEach(function(key) { 
     self[key](data[key]); 
    }); 
    } 
} 

var User = function(init) { 
    var self = this; 
    self.firstName = ko.observable(); 
    self.lastName = ko.observable(); 
    self.city = ko.observable(); 

    this.update(init); 
}; 

User.prototype = baseViewModel;

來源

2016-01-29 21:39:04 Tyrsius

淘汰賽映射響應對象

回答

相關問題