Ionic 2, использование разрывов каналов Angular 2 на iOS — не удается найти переменную: Intl

Это связано с тем, что он использует API интернализации, который в настоящее время доступен не во всех браузерах (например, не в браузере iOS).

См. таблицу совместимости.

Это известная проблема (бета-версия 1).

Вы можете попробовать использовать полифилл для Intl.

Для этого вы можете использовать версию CDN и добавить это в свой index.html:

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

Или, если вы используете Webpack, вы можете установить модуль Intl с помощью NPM:

npm install --save intl

И добавьте эти импорты в свое приложение:

import 'intl';
import 'intl/locale-data/jsonp/en';

Для этого есть быстрое решение. Добавлять

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

в файл index.html перед записью <script src="cordova.js"></script>.

См. этот ответ github https://github.com/angular/angular/issues/3333#issuecomment-203327903

Или другим решением было бы написать эти каналы самостоятельно. Для даты, например, можно использовать moment.js, или вот пример для валютной трубы:

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

@Pipe({ name: 'currency' })

export class CurrencyPipe implements PipeTransform {
    constructor() {}

    transform(value: string, currencyString: string ) { 
        let stringOnlyDigits  = value.replace(/[^\d.-]/g, '');
        let convertedNumber = Number(stringOnlyDigits).toFixed(2);
        return convertedNumber + " " + currencyString;
    }
} 

Эта труба преобразует валюту. Процентная трубка будет работать почти так же. Регулярное выражение фильтрует все цифры, включая точку для чисел с плавающей запятой.

Вот что я сделал с 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 и директиву выделения на тот случай, если кому-то понадобится дополнительная помощь. Не обязательно явно.