javascript - ES5 vs ES6 Javascript 用于数组

Question

我正在尝试将以下内容转换为工作，但我认为这是一个 Es5/ES6 问题。帮助赞赏。

this.rows = Array.from(Array(Math.ceil(this.subCategoryModels.length / 3)).keys());

我目前收到打字错误：

[ts] 
Property 'from' does not exist on type 'ArrayConstructor'.
any

和

[ts] 
Property 'keys' does not exist on type 'any[]'.
any

Answer 1

'ArrayConstructor' 类型上不存在属性 'from'。

这表明您希望ES6在编译为 ES5 的同时使用类型定义。

推荐libTypeScript 最新的选项：

"compilerOptions": {
    "target": "es5",
    "lib": ["es6", "dom"]
}

更多的

https://basarat.gitbooks.io/typescript/content/docs/types/lib.d.ts.html#lib-option

Answer 2

由于您看到这些错误，我假设您正在编译到 ES5。您可以使用类型来使Typescript识别数组的 es2015 函数。

首先，如果尚未安装，请安装类型。

npm install typings --global

安装类型后，为 ES2015 数组函数安装类型类型定义。

typings install -SG env~es2015-array

如果您的目标浏览器不支持新的 Array 函数，您还需要添加一个 polyfill。

Answer 3

我最终做了以下事情：

html

  <ion-row *ngFor="let trio of getTriples()">
    <ion-col *ngFor="let item of trio" (click)="itemTapped(item)">
      <div class="row responsive-md">
        <div id="icon-image-{{item.id}}"><img src="data:image/png;base64,{{item.icon}}" height="75" width="75" /></div>
        <p>{{item.name}}</p>
      </div>
    </ion-col>
  </ion-row>

打字稿

  getTriples() {
    let triples = [];
    let length = this.subCategoryModels.length;
    for (let i = 0; i < length; i += 3) {
      let trio = [];
      trio.push(this.subCategoryModels[i]);
      if (i + 1 < length) {
        trio.push(this.subCategoryModels[i + 1]);
      }
      if (i + 2 < length) {
        trio.push(this.subCategoryModels[i + 2]);
      }
      triples.push(trio);
    }
    return triples;
  }