Ionic Angular不適用於Android設備

Question

我在2天內遇到了Ionic Framework問題。我不知道爲什麼我的控制器沒有被我的設備找到。我有其他離子項目完美工作。有人能幫我嗎 ？

我打電話給我的控制器ng-controller在標籤上，而我的ng-app在body上。然後，我在我的app.js上配置了外部模塊，然後使用按鈕功能接下來我的controller.js。這段代碼完全適用於瀏覽器，但在Android設備上，他不執行任何這些angularjs指令。

我app.js

var app = angular.module('starter', ['ionic', 'ionic-datepicker', 'ion-floating-menu', 'ionic-timepicker']); 
 

 
app.run(function ($ionicPlatform) { 
 
    $ionicPlatform.ready(function() { 
 
    if (window.cordova && window.cordova.plugins.Keyboard) { 
 
     cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true); 
 
     cordova.plugins.Keyboard.disableScroll(true); 
 
    } 
 
    if (window.StatusBar) { 
 
     StatusBar.styleDefault(); 
 
    } 
 
    }); 
 
}) 
 

 
app.config(function (ionicTimePickerProvider) { 
 
    var timePickerObj = { 
 
    inputTime: (((new Date()).getHours() * 60 * 60) + ((new Date()).getMinutes() * 60)), 
 
    format: 24, 
 
    step: 10, 
 
    setLabel: 'Set', 
 
    closeLabel: 'Close' 
 
    }; 
 
    ionicTimePickerProvider.configTimePicker(timePickerObj); 
 
}) 
 

 
app.config(function (ionicDatePickerProvider) { 
 
    var datePickerObj = { 
 
    inputDate: new Date(), 
 
    titleLabel: 'Selecione a data', 
 
    setLabel: 'OK', 
 
    todayLabel: 'Hoje', 
 
    closeLabel: 'Fechar', 
 
    mondayFirst: false, 
 
    weeksList: ["Dom", "Seg", "Ter", "Quar", "Quin", "Sex", "Sab"], 
 
    monthsList: ["Janeiro", "Fevereiro", "Março", "Abril", "Maio", "Junho", "Julho", "Agosto", "Setembro", "Outubro", "Novembro", "Dezembro"], 
 
    templateType: 'popup', 
 
    from: new Date(2012, 8, 1), 
 
    to: new Date(2018, 8, 1), 
 
    showTodayButton: true, 
 
    dateFormat: 'dd MMMM yyyy', 
 
    closeOnSelect: false, 
 
    disableWeekdays: [] 
 
    }; 
 
    ionicDatePickerProvider.configDatePicker(datePickerObj); 
 
}) 
 

 
app.controller('mainController', function ($scope, $ionicPopup, $timeout, $ionicListDelegate, 
 
    ionicDatePicker, ionicTimePicker, $interval) { 
 

 
    //Task Recebe a Model taskModel 
 
    var tasks = new getTask(); 
 

 
    $scope.dias = 0; 
 
    $scope.horas = 0; 
 
    $scope.minutos = 0; 
 
    $scope.segundos = 0; 
 
    $scope.fullTime = {}; 
 
    $scope.taskDate = ''; 
 
    $scope.taskTime = { 
 
    horas: "", 
 
    minutos: "" 
 
    }; 
 
    var data = $scope.taskTime; 
 
    $scope.lista = tasks.items; 
 
    $scope.showMarket = false; 
 
    $scope.removeStatus = false; 
 
    $scope.plusHide = false; 
 

 
    $scope.marcarTarefa = function (item) { 
 
    item.finalizada = !item.finalizada; 
 
    }; 
 

 
    $scope.click = function() { 
 
    console.log($scope.showMarket); 
 
    }; 
 

 
    $scope.onHideItem = function (item) { 
 
    return item.finalizada && $scope.showMarket; 
 
    }; 
 

 
    $scope.onItemRemove = function (item) { 
 
    tasks.remove(item); 
 
    tasks.save(); 
 
    }; 
 

 
    $scope.onControlShow = function() { 
 
    $scope.removeStatus = !$scope.removeStatus; 
 
    $scope.plusHide = !$scope.plusHide; 
 
    }; 
 

 
    function conveterTempo(item) { 
 

 
    var _second = 1000; 
 
    var _minute = _second * 60; 
 
    var _hour = _minute * 60; 
 
    var _day = _hour * 24; 
 
    var timer; 
 

 
    var now = new Date().getTime(); 
 
    console.log(now); 
 
    var timeRest = new Date(item.date).getTime(); 
 
    console.log(timeRest); 
 
    var distance = timeRest - now; 
 
    console.log(distance); 
 

 

 
    var days = Math.floor(distance/_day); 
 
    $scope.dias = days; 
 
    var hours = Math.floor((distance % _day)/_hour); 
 
    $scope.horas = hours; 
 
    var minutes = Math.floor((distance % _hour)/_minute); 
 
    $scope.minutos = minutes; 
 
    var seconds = Math.floor((distance % _minute)/_second); 
 
    $scope.segundos = seconds; 
 
    }; 
 

 
    //Função de click do relógio 
 
    $scope.onItemClick = function (item) { 
 

 
    conveterTempo(item); 
 

 
    $ionicPopup.show({ 
 
     title: "Tempo restante", 
 
     scope: $scope, 
 
     template: "Data a ser entregue: " + item.date + "<p>Hora de entrega: " + 
 
     item.time.horas + " : " + item.time.minutos + "</p>" + "<br>" 
 
     + "Faltam: " +$scope.dias + " - dias <br>" +$scope.horas+" horas "+ $scope.minutos + " minutos " + $scope.segundos, 
 
     buttons: [{ 
 
     text: "Ok", 
 
     }, { 
 
     text: "Cancelar" 
 
     },] 
 
    }); 
 
    $ionicListDelegate.closeOptionButtons(); 
 
    } 
 
    //Fim da função do clique -----> 
 

 

 
    //Função acionada ao click no campo de input da data 
 
    $scope.openDatePicker = function() { 
 
    //Recebe a data do datepicker e passa para o escopo 
 
    var getData = { 
 
     callback: function (val) { 
 
     $scope.taskDate = new Date(val).toDateString(); 
 
     }, 
 
    }; 
 
    ionicDatePicker.openDatePicker(getData); 
 
    }; 
 

 

 
    $scope.openTimePicker = function() { 
 
    //Recebe a data do datepicker e passa para o escopo 
 
    var getTime = { 
 
     callback: function (val) { 
 
     if (typeof (val) === 'undefined') { 
 
      console.log('Time not selected'); 
 
     } else { 
 
      var selectedTime = new Date(val * 1000); 
 

 
      $scope.taskTime = { 
 
      horas: selectedTime.getUTCHours(), 
 
      minutos: selectedTime.getUTCMinutes() 
 
      }; 
 

 
      $scope.taskTime.full = $scope.taskTime.horas + " : " + $scope.taskTime.minutos; 
 

 
     }; 
 
     }, 
 
    }; 
 
    ionicTimePicker.openTimePicker(getTime); 
 
    }; 
 

 
    $scope.fullTime = function (data) { 
 
    if (data.horas === '') { 
 
     console.log("Ainda não possui tempo definido.") 
 
    } else { 
 
     console.log("Horas: " + data.horas); 
 
     console.log("Minutos: " + data.minutos); 
 
     return data.horas + ":" + data.minutos; 
 
    } 
 
    }; 
 

 

 

 

 
    $scope.onItemAdd = function() { 
 
    var item = { 
 
     nome: '', 
 
     finalizada: true, 
 
     date: '', 
 
     time: 
 
     { 
 
     horas: '', 
 
     minutos: '' 
 
     } 
 
    }; 
 
    getItem(item, true); 
 
    }; 
 

 
    function getItem(item, novo) { 
 
    $scope.data = {}; 
 
    $scope.time = {}; 
 
    $scope.data.newTask = item.nome; 
 

 
    $ionicPopup.show({ 
 
     title: "Nova tarefa", 
 
     scope: $scope, 
 
     template: "<input type='text' placeholder='Nova tarefa...' autofocus ='true' ng-model='data.newTask'>" + 
 
     "<input type='text' placeholder='Selecione a data de conclusão' ng-model='taskDate' ng-click='openDatePicker()' />" + 
 
     "<input type='text' placeholder='Selecione a hora de conclusão' ng-model='taskTime.full' ng-init='taskTime.full = fullTime(taskTime)' ng-click='openTimePicker()'>", 
 
     buttons: [{ 
 
     text: "Ok", 
 
     onTap: function (e) { 
 

 
      item.nome = $scope.data.newTask; 
 
      item.date = $scope.taskDate; 
 
      item.time.horas = $scope.taskTime.horas; 
 
      item.time.minutos = $scope.taskTime.minutos; 
 
      if (novo) { 
 
      tasks.add(item); 
 
      }; 
 
      tasks.save(); 
 
     } 
 
     }, { 
 
     text: "Cancelar" 
 
     },] 
 
    }); 
 
    $ionicListDelegate.closeOptionButtons(); 
 
    }; 
 

 
    $scope.onItemEdit = function (item) { 
 
    getItem(item, false); 
 
    }; 
 

 
});

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
\t <meta charset="utf-8"> 
 
\t <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width"> 
 
\t <title>TaskFC</title> 
 
\t <link rel="manifest" href="manifest.json"> 
 

 
\t <link href="lib/ionic/css/ionic.css" rel="stylesheet"> 
 
\t <link href="css/style.css" rel="stylesheet"> 
 
\t <script src="lib/ionic/js/ionic.bundle.js"></script> 
 

 
\t <link href="css/ion-floating-menu.min.css" rel="stylesheet"> 
 
\t <script src="lib/angular-timer/angular-timer.min.js"></script> 
 
\t <script src="lib/floating-menu/ion-floating-menu.min.js"></script> 
 
\t <script src="js/taskModel.js"></script> 
 
\t <script src="cordova.js"></script> 
 
\t <script src="js/app.js"></script> 
 
\t <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script> 
 
\t <script src="lib/ionic-datepicker/dist/ionic-datepicker.bundle.min.js"></script> 
 
\t <script src="lib/ionic-timepicker/dist/ionic-timepicker.bundle.min.js"></script> 
 

 
</head> 
 

 
<body ng-app="starter"> 
 

 
\t <ion-pane ng-controller="mainController"> 
 
\t \t <ion-header-bar class="bar-positive"> 
 
\t \t \t <!--<button class="button button-icon icon ion-navicon"></button>--> 
 
\t \t \t <h1 class="title">Lista de tarefas</h1> 
 
\t \t \t <button class="button button-icon icon ion-settings" ng-click="onControlShow()"></button> 
 
\t \t </ion-header-bar> 
 
\t \t </div> 
 
\t \t <ion-content> 
 
\t \t \t <ion-list show-delete="removeStatus"> 
 
\t \t \t \t <ion-item ng-repeat="item in lista track by $index" ng-hide="onHideItem(item)"> 
 
\t \t \t \t \t <!--especificando a propriedade do item buscada--> 
 
\t \t \t \t \t <div class="row"> 
 
\t \t \t \t \t \t <div class="col col-50"> 
 
\t \t \t \t \t \t \t <div class="item-icon-right" ng-click="onItemClick(item)"> 
 
\t \t \t \t \t \t \t \t {{item.nome}} 
 
\t \t \t \t \t \t \t \t <i class="icon ion ion-android-time"></i> 
 
\t \t \t \t \t \t \t </div> 
 
\t \t \t \t \t \t \t <ion-delete-button class="ion-minus-circled" ng-click="onItemRemove(item)"></ion-delete-button> 
 
\t \t \t \t \t \t \t <ion-option-button class="button-positive" ng-click="onItemEdit(item)">Editar</ion-option-button> 
 
\t \t \t \t \t \t </div> 
 
\t \t \t \t \t \t <div class="col"> 
 

 

 
\t \t \t \t \t \t </div> 
 
\t \t \t \t \t \t <div class="col"> 
 
\t \t \t \t \t \t \t <button class="button button-positive button-small button-outline" ng-click="marcarTarefa(item)"> 
 
         <i class="ion ion-checkmark" ng-show="!item.finalizada"></i> 
 
         </button> 
 
\t \t \t \t \t \t </div> 
 
\t \t \t \t \t </div> 
 
\t \t \t \t </ion-item> 
 
\t \t \t </ion-list> 
 
\t \t \t <div style="text-align:center; font-size:10px;">Icons made by <a href="http://www.flaticon.com/authors/madebyoliver" title="Madebyoliver">Madebyoliver</a> from <a href="http://www.flaticon.com" 
 
\t \t \t \t \t title="Flaticon">www.flaticon.com</a> is licensed by <a href="http://creativecommons.org/licenses/by/3.0/" title="Creative Commons BY 3.0" 
 
\t \t \t \t \t target="_blank">CC 3.0 BY</a></div> 
 
\t \t </ion-content> 
 

 
\t \t <ion-footer-bar class="bar-positive"> 
 
\t \t \t <div class="row row-center"> 
 
\t \t \t \t <div class="col col-90"> 
 
\t \t \t \t \t <div class="buttons"> 
 
\t \t \t \t \t \t <button class="button button-clear button-light">Finalizadas</button> 
 
\t \t \t \t \t </div> 
 
\t \t \t \t </div> 
 
\t \t \t \t <div class="10"> 
 
\t \t \t \t \t <label class="toggle toggle-light toggle-small"> 
 
        <input type="checkbox" ng-model="showMarket" /> 
 
         <div class="track"> 
 
         <div class="handle"></div> 
 
        </div> 
 
       </label> 
 
\t \t \t \t </div> 
 
\t \t \t </div> 
 
\t \t </ion-footer-bar> 
 
\t \t <div class="row responsive-sm"> 
 
\t \t \t <ion-floating-button ng-click="onItemAdd()" ng-show="plusHide" has-footer="true" button-color="#EF473A" icon="ion-plus" icon-color="#fff"> 
 
\t \t \t </ion-floating-button> 
 
\t \t </div> 
 
\t </ion-pane> 
 
</body> 
 

 
</html>

我taskModel.js

//Rarray de itens 

功能getTask（）{ this.items = [];

var lista = localStorage.getItem("tasklist"); 

if(lista !== null) 
{ 
this.items = angular.fromJson(lista); 
}; 

this.save = function() { 
    var lista = angular.toJson(this.items); 
    localStorage.setItem("tasklist", lista); 
}; 

this.remove = function (item) { 
    var pos = this.items.indexOf(item); 
    this.items.splice(pos, 1); 
}; 

this.add = function (item) { 
    this.items.push(item); 
}; 

}

Answer 1

把你的代碼，以離子游樂場，在這裏發生的錯誤：

//Task Recebe a Model taskModel 
var tasks = new getTask(); 

getTask沒有在你的代碼中定義。所以你的控制器在啓動時直接拋出一個錯誤。

Here's the Playground example，以防你想玩弄它。 ;）