Backbone: using setInterval

Backbone: using setInterval

I need the view to refetched the collection and re-render every 30
seconds. The problem is that once I change page (without a full page
refresh) the setInterval stays on memory and keeps refetching in the
background. However the view has long been destroyed.
Code:
define(
[
"underscore",
"collection/system/feed",
"view/list",
"text!template/index/system-feed.html"
],
function (_, Collection, ListView, Template) {
return ListView.extend({
el: '<div id="main-inner">',
collection: new Collection(),
loading: true,
client: false,
initialize: function (options) {
this.collection.fetch();
this.collection.on('reset', this.onFetchCollection, this);
var self = this;
setInterval(function() {
self.collection.fetch();
}, 30000);
},
/*collection is returned, so reset the loading symbol and set
the posts to the render*/
onFetchCollection: function () {
this.list = this.collection.toJSON();
this.loading = false;
this.render();
},
render: function () {
var html = _.template(Template, {loading: this.loading,
client: this.client, list: this.list});
this.$el.html(html);
return this;
}
});
}
);