Rivets.js绑定默认javascript适配器不总是更新

时间:2014-01-09 21:51:58

标签: javascript rivets.js

我是Rivets.js的新手,但我有一个基本网站使用我自己的js模型的数组集合,只使用带铆钉的默认适配器。如果我从数组推送和拼接模型对象,它工作正常 - 视图更新完美。但是,如果我尝试仅对一个模型对象使用变量引用,则视图在第一页加载时完美呈现,但如果我将引用更改为指向另一个模型,则dom不会更新。所以我想绑定不是由对象更改触发的。

如果可能的话,我真的不想使用像BackBone这样的任何其他模型框架。有没有一种方法可以构建我的模型,以便它们正确绑定,并通过更改模型引用来触发更新?

默认铆钉适配器如何正常工作 - 我可以从Rivets.js文件中看到它检测到数组更改和。改变但不是100%如何编写我的模型来工作?

任何帮助保持简单的帮助将非常感激。

这是我的意思的一个例子:

***** HTML
<div id="overview" rv-data-id="model.id">
  <h1>{ model.title }</h1>
  <h3 rv-text="model.description"></h3>
  <section class="content" rv-html="model.copy"></section>
  <div id="open-close-prompt" rv-on-click="controller.onToggleCaseStudyOverView">Update</div>
</div>

***** JS
var t = this;

var firstCaseStudy = {id:"1", title:"test 1 ",description:"1 a test description", copy:"test copy 1"};
var anotherCaseStudy = {id:"3", title:"test3 ",description:"3 a test description", copy:"test copy 3"};

var caseStudyModel = {cs:firstCaseStudy};

var overViewDOM = $('#overview');
var overView = rivets.bind(overViewDOM, {model: caseStudyModel.cs, controller:t});

//Method called when link clicked ion page
t.onToggleCaseStudyOverView = function(){

    //THIS DOES UPDATE
    caseStudyModel.cs.id = "2";
    caseStudyModel.cs.title = "update title 2";

    //THIS DOESN'T UPDATE
    caseStudyModel.cs = anotherCaseStudy;
}

0 个答案:

没有答案