離子2,在iOS上使用Angular 2管道中斷 - “找不到變量:Intl”


Answers

有一個快速解決這個問題。 加

<script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=Intl.~locale.en"></script>

<script src="cordova.js"></script>的index.html文件。

看到這個Github的答案https://github.com/angular/angular/issues/3333#issuecomment-203327903

Question

在模板中使用日期,百分比和貨幣管道時遇到同樣的問題 -

例如,我正在使用一個簡單的百分比管道:

{{ .0237| percent:'1.2-2' }}

它在Chrome上運行,但是當我部署到一個iOS設備,它會引發這個錯誤:

“EXCEPTION:ReferenceError:找不到變量:Intl in [{{{.0237 | percent:'1.2-2'}} ...”

有其他人遇到這個問題嗎? 任何建議或幫助將不勝感激! 謝謝!




這是我用RC3做的。 我認為它也可以用於RC4。

通過輸入ionic g pipe pipe-transform來創建一個管道

清理代碼以刪除@Injectable 。 另外,使用駱駝案例如下所示。 實施PipeTransform

import { Pipe, PipeTransform} from '@angular/core';

/**
 * Takes a number and transforms into percentage upto
 * specified decimal places
 *
 * Usage:
 * value | percent-pipe: decimalPlaces
 *
 * Example:
 * 0.1335 | percent-pipe:2
*/
@Pipe({
  name: 'percentPipe'
})
export class PercentPipe implements PipeTransform {
  /**
   * Takes a number and returns percentage value
   * @param value: number
   * @param decimalPlaces: number
   */
  transform(value: number, decimalPlaces:number) {
    let val = (value * 100).toFixed(decimalPlaces);
    return val + '%';
  }
}

在你的app.module添加declarations數組。

然後在html中使用它,就像上面的示例使用。 這是我的例子

 <ion-col *ngIf="pd.wtChg < -0.05  || pd.wtChg > 0.05" width-25 highlight>
    {{pd.wtChg | percentPipe: 2}}
  </ion-col>

注意我還使用了一個* ngIf和一個高亮指令,以防有人需要額外的幫助。 不是很明顯。