陣列的ES5與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”。

這表明您希望在仍編譯為ES5的同時使用ES6類型定義。

推薦最新的TypeScript中的lib選項：

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

更多

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

Answer 2

由於您看到了這些錯誤，因此我假設您正在編譯到ES5。 您可以使用分型 ，使打字稿識別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;
  }