如何過濾骨幹集合以顯示標籤

我正在創建一個書籤工具，可以讓您通過頁內表單創建存儲書籤的列表。該列表將包含標識符標籤（例如 - 亞馬遜www.amazone.com標籤：購物）。在這個創建的列表中，我還想要列出顯示已命名的各種標記的列表。如何過濾骨幹集合以顯示標籤

這應該可能使用過濾器方法，但我似乎無法得到它來過濾正確的列表;我一直在爲每個創建的URL列出每個標籤，因此有多個相同標籤的例子。

下面是在創建我的表單，生成的URL列表和模塊導出時正確工作的代碼。這是我的看法js文件：

var $ = require('jquery'); 
var Backbone = require('backbone'); 
var listTemplate = require('../../templates/addresslist.hbs'); 
var formTemplate = require('../../templates/addressform.hbs'); 
var detailTemplate = require('../../templates/addressdetail.hbs'); 

var AddressFormView = Backbone.View.extend({ 
    tagName: 'form', 
    template: formTemplate, 
    events: { 
    'submit': 'addAddress' 
    }, 
    render: function(){ 
    var renderedHtml = this.template(); 
    this.$el.html(renderedHtml); 
    return this; 
    }, 
    addAddress: function(event){ 
    event.preventDefault(); 
    this.collection.create({ 
     title: $('#title').val(), 
     url: $('#url').val(), 
     tag: $('#tag').val(), 
    }); 
    $('#title').val(''); 
    $('#url').val(''); 
    $('#tag').val(''); 
    }, 
}); 

var AddressListView = Backbone.View.extend({ 
    tagName: 'ul', 
    initialize: function(){ 
    this.listenTo(this.collection, 'add', this.renderItem); 
    }, 
    render: function(){ 
    return this; 
    }, 
    renderItem: function(address){ 
    console.log('address', address); 
    var addressItem = new AddressItemView({model: address}); 
    this.$el.append(addressItem.render().el); 
    } 
}); 

var AddressItemView = Backbone.View.extend({ 
    tagName: 'li', 
    template: listTemplate, 
    render: function(){ 
    var context = this.model.toJSON(); 
    this.$el.html(this.template(context)); 
    return this; 
    } 
}); 

var AddressDetailView = Backbone.View.extend({ 
    template: detailTemplate, 
    render: function(){ 
    this.$el.html('').append(this.template); 
    return this; 
    } 
}); 

module.exports = { 
    'AddressFormView': AddressFormView, 
    'AddressListView': AddressListView, 
    'AddressItemView': AddressItemView, 
    'AddressDetailView': AddressDetailView, 
}

我的路由器的js文件看起來像這樣：

var $ = require('jquery'); 
var Backbone = require('backbone'); 
var views = require('./views/addressview'); 
var models = require('./models/address'); 

var Router = Backbone.Router.extend({ 
    routes: { 
    '': 'index', 
    'detail/:id/': 'detail' 
    }, 

    initialize: function(){ 
    this.collection = new models.AddressCollection(); 
    }, 

    index: function(){ 
    var addressForm = new views.AddressFormView({collection: this.collection}); 
    $('.app').html(addressForm.render().el); 

    var addressListing = new views.AddressListView({collection: this.collection}); 
    $('.app').append(addressListing.render().el); 

    this.collection.fetch(); 
    }, 

    detail: function(addressId){ 
    this.collection.fetch().done(function(){ 
     var address = this.collection.get(addressId); 
     var addressDetail = new views.AddressDetailView({model: address}); 
     $('.app').html(addressDetail.render().el); 
    }.bind(this)); 
    }, 
}); 

var router = new Router(); 

module.exports = router;

來源

2016-06-27 pairof9s

我沒有看到在哪裏進行過濾。 – 76484

我無法弄清楚你的問題究竟是什麼。也許嘗試重述這個問題？ –

@TJ是的，我發佈這個問題的工作做得並不好。總之，我試圖瞭解如何使用collection.filter方法來提取每個獨特的標籤。上面的代碼並不包含我的努力;它顯示了到目前爲止的一切。也許我會刪除這個並重新發佈一個更簡潔的請求。 – pairof9s

中查看多個變量選擇創建新的事件

tagSelected :function(event){ 
    var tags = [<tag1>,<tag2>] //getting from multiple tag selection 
    var models = _.filter(this.collection.models,function(model){ 
    return tags.indexOf(model.get('tag')) >= 0; 
    }) 
    this.collection.reset(models); 
    this.render(); 
})

來源

2016-07-06 13:05:06

如何過濾骨幹集合以顯示標籤

回答

相關問題