在Sproutcore 2中编写自定义控件

Question

我对Sproutcore很新,但我熟悉Handlebars.我已经完成了Todo教程并检查了一些其他样本.

我喜欢它的一切,并希望在Backbone上使用它,但我很难理解如何连接自定义控件.我可以看到一些数据将在绑定中发挥作用,但触发我迷失的事件.

举个例子,如果我有一个链接列表,我想用它来过滤它下面的数据,那我该如何处理这些事件呢？我知道在骨干中你会使用事件和选择器:"click .link"

任何帮助将不胜感激!

Answer 1

听起来你想要遍历一个对象列表并创建链接,这些链接在被点击时会调用一些可以访问原始对象的JavaScript代码.

目前,最简单的方法是将模板上下文绑定到新的自定义视图.你可以在这个JSFiddle看到一切:http://jsfiddle.net/67GQb/

模板:

{{#each App.people}}
    {{#view App.PersonView contentBinding="this"}}
    <a href="#">{{content.fullName}}</a>
    {{/view}}
{{/each}}

应用代码:

App = SC.Application.create();

App.Person = SC.Object.extend({
    fullName: function() {
        return this.get('firstName') + ' ' + this.get('lastName');
    }.property('firstName', 'lastName') 
});

App.people = [
    App.Person.create({ firstName: "Yehuda", lastName: "Katz" }),
    App.Person.create({ firstName: "Tom", lastName: "Dale" })
];

App.PersonView = SC.View.extend({
    mouseDown: function() {
        // Note that content is bound to the current template
        // context in the template above.
        var person = this.get('content');
        alert(person.get('firstName'));
    }
});

也就是说,我们知道这有点麻烦,并且有一些想法可以进一步简化我们将在未来几周内开展的工作.