2016-07-29 7 views
1

Ich bin derzeit in der Startphase ein App Wetter über Ionic Gebäude. Im Moment möchte ich die Cordova Geolocation implementieren, ich habe Fehler Unknown provider: $cordovaGeolocationProvider <- $cordovaGeolocation Ich versuche zu beheben, aber erfolglos, aber dies hält einen Fehler beim Öffnen es. Zu Testzwecken verwende ich ionic serve und überprüfe es in localhost.

meinen Code

(function() { 
    angular.module('app.weather', ['ionic']) 

     .factory('Weather', function($q, $http) { 
      var deferred = $q.defer(); 

      function getCurrentWeather(lat, lng) { 
       var url = 'https://api.forecast.io/forecast//' + lat + ',' + lng + '?callback=JSON_CALLBACK'; 
       $http.jsonp(url) 
        .success(deferred.resolve) 
        .error(deferred.reject); 

       return deferred.promise; 
      } 

      return { 
       getCurrentWeather: getCurrentWeather 
      }; 
     }) 
     .controller('WeatherCtrl', function($scope, $cordovaGeolocation, Weather) { 
      $scope.loading = true; 

      $scope.toCelsius = function(temperature) { 
       return ((temperature - 32)/1.8).toFixed(1); 
      }; 

      $cordovaGeolocation 
       .getCurrentPosition({ 
        timeout: 10000, 
        enableHighAccuracy: false 
       }) 
       .then(function(position) { 
        var lat = position.coords.latitude; 
        var long = position.coords.longitude; 

        Weather.getCurrentWeather(lat, long).then(function(data) { 
         $scope.weatherInfo = data; 
         $scope.loading = false; 
        }, function(error) { 
         //TODO Display error message 
        }); 
       }, function(err) { 
        //TODO Display error message 
       }); 
     }); 
})(); 

Code html

<ion-view title="الرئيسية" id="page2" style="background-color:#FFFFFF;" class=" "> 
    <ion-content padding="true" class="has-header"> 
    <ion-pane> 
<div ng-controller="WeatherCtrl as weatherCtrl"> 
<div ng-show="loading"> 
       Carregando informações... 
      </div> 
      <div ng-hide="loading"> 
       <p> 
        Temperatura: {{toCelsius(weatherInfo.currently.temperature)}}º 
       </p> 
       <p> 
        Sensação térmica: {{toCelsius(weatherInfo.currently.apparentTemperature)}}º 
       </p> 
      </div> 
         </div> 

    </ion-content> 
</ion-view> 
+0

Versuchen Sie dieses Add http://stackoverflow.com/a/36158618/ 5059916 –

+0

hast du 'ng-cordova'-datei enthalten? –

Antwort

1

Stellen Sie sicher, dass Sie ngCordova oder Ionic Native installiert, sonst kann man nicht $cordovaGeolocation verwenden, da es ein Wrapper in entweder einer dieser Bibliotheken definiert ist.

Sie finden Anweisungen zur Installation here und here für Ionic Native. Es gibt auch einen kürzlich erschienenen Artikel über Ionic Nativehere, der von Interesse sein könnte.

Denken Sie auch daran, dass eine Mehrheit der Cordova Plugins funktionieren nicht im Browser, so dass Sie auf einem Gerät testen müssen.

+0

danke i fixed – razak

0

$ cordovaGeolocation Funktionalität, zusammen mit allen anderen nativen Funktionalität kann nur in einem Emulator oder auf einem Gerät verwendet werden. Wenn Sie die App über den Browser bereitstellen, kann sie nicht mit dem Plugin verbunden werden und ist daher nicht definiert.

+0

danke ich habe behoben – razak

5

Add 'ngCordova' in Ihrem Modul wie

(function() { 
    angular.module('app.weather', ['ionic','ngCordova']) 

dann ngcordova.min.js Datei Link in Ihrer index.html