Question

我有这样的地图：

var AppState = can.Map.extend({
  sites: null
});
appstate = new AppState();

列表填充如下：

Site.findAll({}, function(sites) {
  appstate.attr('sites', sites);
});

我传递给这样的控件：

new SummaryCtrl("#summaryCtrl", {sites:appstate.compute('sites')});

控件如下所示：

var SummaryCtrl = can.Control.extend({
  '{sites} change': function(ev, type, sites) { //this doesn't fire
    var recent = sites.slice(0,25);
    var siteCount = sites.length;
    this.element.html(can.view('summaryTpl', {siteCount:siteCount, recent:recent}));
  }
});

然后我这样做：

var newsite = {blah1:'blahblah', blah2:'blahblah'};
appstate.sites.unshift(newsite);

但是＆＃39; {sites}更改＆＃39;功能不起作用。知道为什么吗？谢谢！

Answer 1

找出一个解决方案 - 不确定它是否是最好的解决方案，但我可以使用它。

我意识到列表的计算与列表没有相同的接口。直觉上，我认为它会。因此，不要将列表的计算传递给控件，只需传递列表本身并根据需要在列表中使用.replace和.unshift。

如果你需要使用地图，那很好，但是再次，不要传递地图上属性的计算，只需引用属性本身并初始化为空列表，如下所示：

var State = can.Map.extend({
  sites: new can.List()
});

http://jsfiddle.net/c7tdma5k/25/

Answer 2

这不起作用的原因是因为计算仅在sites属性更改时更改，而不是站点中的各个项目。

如果你创建了像：

这样的计算机

var sites = can.compute(function(){ var sites = appState.attr("sites"); sites.attr("length") return new List().replace(sites) })

这样可行。只要在列表中插入或删除项目，计算就会发生变化。但是，您的答案是更好的方法。

在计算List时更改事件

2 个答案: