2016-03-02 5 views
0

Приложение Ionic 2 отлично работает на браузере Chrome, оно дает ожидаемый результат. Но когда он запускается на симуляторе или в браузере, появляется ошибка ниже.ИСКЛЮЧЕНИЕ: TypeError: undefined не является объектом (оценка «pipe.constructor») в Ionic 2?

Вот код, я использую: реализация

<label class="time">{{appointment.DateSent | date:"HH"}}:{{ appointment.DateSent| date:"mm"}}</label> 
<label class="month">{{appointment.DateSent| date:"MMM"}}</label> 
<label class="day">{{appointment.DateSent| date:"dd"}}</label> 
<label class="year">{{appointment.DateSent| date:"yyyy"}}</label> 

Класса:

import {Page, NavController, NavParams} from 'ionic/ionic'; 
    import { Component, Pipe, PipeTransform, Inject, OnInit} from 'angular2/core'; 
    import 'rxjs/add/operator/map'; 
    import { Http, Headers, URLSearchParams } from 'angular2/http'; 
    import {SERVER_URL, appName, alertAppName} from '../services/config'; 
    import {AppointmentsDetailPage} from '../appointments-detail/appointments-detail'; 
    import {MessagesService} from '../services/messages-service'; 

    var today = new Date(); 

    @Page({ 
     templateUrl: 'build/pages/appointments/appointments.html', 
     providers: [MessagesService] 
    }) 
    export class AppointmentsPage implements PipeTransform { 
     constructor(http: Http, nav: NavController, messagesService:MessagesService, navParams:NavParams) { 
      this.http = http; 
      this.messagesService = messagesService; 
      this.nav = nav; 

      this.selectedItem = navParams.get('item'); 
     } 

ngOnInit() { 
     this.messagesService.getAppointmentList() 
     .subscribe(data => { 

      var appointments = new Array(); 
       for(var i in data){ 
       var key = data[i]; 

       appointments.push({ 
        MessageID: key.MessageID, 
        CategoryID: key.CategoryID, 
        DateSent: new Date(key.DateSent), 
        Title: key.Title, 
        MessageContent: key.MessageContent, 
        Sender: key.Sender, 
        Recipient: key.Recipient, 
        DateReceived: key.DateReceived, 
        DateRead: key.DateRead, 
        Note_Direction: key.Note_Direction, 
        Viewed: key.Viewed, 
        AppointmentDateTime: key.AppointmentDateTime, 
        MessageAttachments: key.MessageAttachments 
       }); 
       } 


     this.appointments = appointments; 

Все дата труба работает хорошо в браузере Chrome без ошибок, но это дает ниже исключения на тренажер или устройство (вынул из отладки тренажера Safari)

enter image description here

Отредактировано:

Index.html

<!DOCTYPE html> 
<html dir="ltr" lang="en"> 

<head> 
    <title>Ionic</title> 
    <meta charset="UTF-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"> 

    <!--<meta http-equiv="Content-Security-Policy" content="img-src 'self' data:; default-src 'self' http://XX.XX.XX.XX:8084/mypp/">--> 
    <!--<meta http-equiv="Content-Security-Policy" content="default-src *; script-src 'self' 'unsafe-inline' 'unsafe-eval' *; style-src 'self' 'unsafe-inline' *">--> 
    <meta name="format-detection" content="telephone=no"> 
    <meta name="msapplication-tap-highlight" content="no"> 

    <link rel="stylesheet" href="build/css/font-awesome.min.css"> 
    <link ios-href="build/css/app.ios.css" rel="stylesheet"> 
    <link md-href="build/css/app.md.css" rel="stylesheet"> 



</head> 

<body> 
    <ion-app></ion-app> 

    <script src="node_modules/es6-shim/es6-shim.min.js"></script> 
    <script src="node_modules/systemjs/dist/system-polyfills.js"></script> 
    <script src="lib/ngCordova/dist/ng-cordova.js"></script> 
    <script src="cordova.js"></script> 
    <script src="build/js/app.bundle.js"></script> 
</body> 

</html> 

ответ

0

ответ Sasxa помог мне решить эту проблему. Хотя я пытался указать путь, он, похоже, не находит свой ресурс. Следующие ресурсы помогли мне получить ответ. Как указал Саша, Safari нуждается в полилинии Intl.

  1. https://www.npmjs.com/package/intl
  2. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl#Browser_Compatibility

Я попытался установить его с помощью НПМ и Бауэр это не сработало, я, наконец, рассчитаться с помощью расположения ТПС, как это работает для меня.

Надеюсь, это помогло для некоторых. Пожалуйста, дайте мне знать, если кому-то нужна помощь!

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

Вы должны загрузить polyfills (Chrome может работать Угловая без них):

<script src="node_modules/es6-shim/es6-shim.min.js"></script> 
<script src="node_modules/systemjs/dist/system-polyfills.js"></script> 
+0

Hi Sasxa, Спасибо за помощь! но все же он дает ошибку. Я обновил вопрос с помощью моего файла index.html, сообщите мне, если вы заметили какую-либо ошибку в нем. – happycoder

+0

Не могу сказать из кода. Можете ли вы построить без комплекта? Таким образом, невозможно определить, где ошибка может быть ... – Sasxa

+0

Да, я могу построить без включения пучка, фактическое устройство также не работает должным образом – happycoder