骨干视图不能在打字稿中使用骨干集合答案

【问题标题】：Backbone view can't use Backbone collection in typescript骨干视图不能在打字稿中使用骨干集合
【发布时间】：2014-05-27 00:21:38
【问题描述】：

我正在尝试创建一个绑定到 Backbone 集合的 Backbone 视图。但根据DefinitelyTyped 的定义文件，Backbone 视图对象只能采用模型作为泛型类型参数。如何将视图绑定到集合？

我当前的代码抛出错误：

export class EnvironmentMenu extends Backbone.View<EnvironmentCollection>{

constructor(options?: Backbone.ViewOptions<EnvironmentCollection>) {
         super(options);
    }
}

错误是Type 'EnvironmentCollection' does not satisfy the constraint 'Backbone.Model' for type parameter 'TModel extends Backbone.Model'

我假设是因为定义中的这一行：

class Collection<TModel extends Model> extends ModelBase

我的模型和收藏现在只是空壳

环境模型

export class EnvironmentModel extends Backbone.Model {
    constructor(options?) {
        super(options);
    }
}

环境收集

export class EnvironmentCollection 
    extends Backbone.Collection<EnvironmentModel> {

    constructor(options?) {
        super(options);
        this.model = EnvironmentModel;
    }
}

【问题讨论】：

标签： javascript backbone.js typescript

【解决方案1】：

这个问题的答案是基本上将集合包装在一个单独的模型中，在这个特定的场景中除了编译没有错误之外几乎没有增加额外的价值，但我实际上发现存储与集合相关的附加信息很方便，这些信息是还不是集合属性的一部分。

export class EnvironmentViewCollection extends Backbone.Model {
    constructor(collection: EnvironmentCollection, options?: any) {    
         options = options || {};
         options.innerCollection = collection;
    }

    getCollection() : EnvironmentCollection {
         return this.get('innerCollection');
    }
}

然后你就可以在视图中使用那个模型了

export class EnvironmentMenu extends Backbone.View<EnvironmentViewCollection> {
    constructor(options?: Backbone.ViewOptions<EnvironmentViewCollection>) {
        super(options);
    }

    useCollection() : void {
        var collectionLength = this.model.getCollection();
        console.log('The length of the collection is', collectionLength);
    }
}

【讨论】：