can.Control.defaults и опция слияние

Question

Использования can.js У меня есть этот контроль:

var Test_Controller = can.Control({ 
    defaults: { 
     option1: 'option1', 
     option2: 'option2', 
     option3: { 
      nested1: 'nested1', 
      nested2: 'nested2', 
      nested3: 'nested3' 
     } 
    } 
}, { 
    init: function() { 
     if ($(this.element).attr('data-newtext')) { 
      this.options.option3.nested2 = $(this.element).data('newtext'); 
     } 

     $(this.element).text(this.options.option3.nested2); 
    } 
}); 

.. и эта разметка:

<div class="instance1" data-newtext="newtext"></div> 
<div class="instance2"></div> 

..ты если я создавать экземпляры этого элемента управления как это:

var instance1 = new Test_Controller('.instance1', {}); 
var instance2 = new Test_Controller('.instance2', {}); 

что я ожидал увидеть на 2 див, один со словом newtext вставленного и другие с ш ord nested2, но то, что я на самом деле вижу, - 2 divs со словом newtext.

Если я изменяю объект опций так, чтобы он не использовал вложенность, но помещает все параметры на верхнем уровне, тогда у меня нет проблем.

Так что, казалось бы, canJS не сливает вложенные объекты правильно при слиянии опций со значениями по умолчанию. Это так? У кого-нибудь есть умные идеи, как я мог бы поддерживать эту функцию без разветвления? Или я пропущу что-то очевидное? Если бы я мог это сделать, это избавило бы меня от необходимости писать много трудоемких вариантов.

Answer 1

Как указано @tikider, использует библиотеки native .extend (в большинстве случаев, вероятно, $.extend), который по умолчанию не делает глубокий клон. Однако вы должны быть в состоянии перезаписать управления setup и сделать глубокий удлиняет:

var Test_Controller = can.Control({ 
    defaults: { 
     option1: 'option1', 
     option2: 'option2', 
     option3: { 
      nested1: 'nested1', 
      nested2: 'nested2', 
      nested3: 'nested3' 
     } 
    } 
}, { 
    setup: function(element, options) { 
     var allOptions = $.extend(true, {}, this.constructor.defaults, options); 
     return can.Control.prototype.setup.call(this, element, allOptions); 
    }, 

    init: function() { 
     if (this.element.attr('data-newtext')) { 
      this.options.option3.nested2 = this.element.data('newtext'); 
     } 

     this.element.text(this.options.option3.nested2); 
    } 
});