一直在寻找如何使用 Twitter Flight 附加到动态创建的元素。
具有以下 HTML
<article>Add element</article>
以及以下组件定义
var Article = flight.component(function () {
this.addElement = function () {
this.$node.parent().append('<article>Add element</article>');
};
this.after('initialize', function () {
this.on('click', this.addElement);
});
});
Article.attachTo('article');
创建新元素后,单击事件不会触发。这是 fiddle :http://jsfiddle.net/smxx5/
最佳答案
恕我直言,这不是您应该使用 Flight 的方式。
每个组件都应该与应用程序的其余部分隔离,因此您应该避免使用 this.$node.parent()
另一方面,您可以与后代互动。
我的建议是创建一个使用事件委托(delegate)的“文章管理器”组件。 例如。
<div class="js-articles">
<article class="js-article-add">Add element</article>
<div/>
和
var ArticlesManager = flight.component(function () {
this.defaultAttrs({
addSelector: '.js-article-add',
articleTpl: '<article class="js-article-add">Add element</article>'
});
this.addArticle = function () {
this.$node.append(this.attr.articleTpl);
};
this.after('initialize', function () {
this.on('click', {
addSelector: this.addArticle
});
});
});
ArticlesManager.attachTo('.js-articles');
关于javascript - 使用 Twitter Flight 将组件附加到动态创建的元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23782056/