Experiencing the same problem with the date, percent, and currency pipes when using them in a template—
For example, I'm using a simple percent pipe:
{{ .0237| percent:'1.2-2' }}
It works when running on Chrome, but when I deploy to an iOS device, it throws this error:
"EXCEPTION: ReferenceError: Can't find variable: Intl in [{{ {{ .0237| percent:'1.2-2' }} ..."
Has anyone else run into this problem? Any suggestions or help would be greatly appreciated! Thanks!
That's because it relies on the internalization API, which is not currently available in all browsers (for example not on iOS browser).
See the compatibility table.
This is a known issue (beta.1).
You can try to use a polyfill for Intl.
To do so, you can use the CDN version, and add this to your index.html:
<script src="https://cdn.polyfill.io/v2/polyfill.min.js?features=Intl.~locale.en"></script>
Or if you use Webpack, you can install the Intl module with NPM:
npm install --save intl
And add these imports to your app:
import 'intl';
import 'intl/locale-data/jsonp/en';