Question

我试图从一个控制器获取经度和纬度值（使用谷歌地图API），并将其发送到另一个控制器。为此，我使用了工厂。但是，将信息发送到工厂或从中读取信息似乎存在问题。

.factory('loc', function(){
var location = {};

return {
setProperty: function(latitude, longitude){
  location.lat = latitude;
  location.lng = longitude;
},
getProperty: function(){
  return location;
}
};
});

第一个控制器（谷歌地图）

.controller('MapCtrl', function($scope, $ionicLoading,loc) {

if (navigator.geolocation) {

navigator.geolocation.getCurrentPosition(function(pos) {
loc.setProperty(pos.coords.latitude, pos.coords.longitude) 
...

在第二个控制器中，我有：

.controller('callCtrl', function($scope,$state,loc) {
$scope.updateTask = function(data) {

  task.location_lng = loc.getProperty().lng;
  task.location_lat = loc.getProperty().lat;
...

Answer 1

请在此处查看运行代码... http://play.ionic.io/app/a24d56659129

HTML

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <link href="https://code.ionicframework.com/1.0.0/css/ionic.min.css" rel="stylesheet">
    <script src="https://code.ionicframework.com/1.0.0/js/ionic.bundle.js"></script>
  </head>
  <body ng-app="app">
    <ion-pane ng-controller="MainCtrl">
      <ion-header-bar class="bar-stable">
        <h1 class="title">Awesome App</h1>
      </ion-header-bar>
      <ion-content class="padding">
        <button class="button button-assertive" ng-click="setLocation()">Set Property</button><br/><br/>
        <button class="button button-assertive" ng-click="getLocation()">Get Property</button><br/><br/>
        <button class="button button-assertive" ng-click="clearLocation()">Clear Property</button>
      </ion-content>
    </ion-pane>
  </body>
</html>

app.js

var app = angular.module('app', ['ionic']);

app.controller('MainCtrl', function($scope,loc) {

  //

  $scope.setLocation = function() {
    loc.setProperty( 100, 150)
  }


  $scope.getLocation = function() {
   alert(JSON.stringify(loc.getProperty()));
  }

  $scope.clearLocation = function() {
    loc.setProperty( "", "")
  }


});

app.factory('loc', function() {
  var location = {};

  return {
    setProperty: function(latitude, longitude){
      location.lat = latitude;
      location.lng = longitude;
    },
    getProperty: function(){
      return location;
    }
  };
});

此处更完整的示例http://play.ionic.io/app/f4332405a2c1

Answer 2

本作品：

var app = angular.module('plunker', []);

app.controller('MainCtrl', function($scope,loc) {
  loc.setProperty(10,20); 
});


app.controller('SubCtrl', function($scope,loc) {

  $scope.updateData = function(){
    //this is the change
    $scope.lat = loc.getProperty().lat;
    $scope.lng = loc.getProperty().lng;
  }
});

app.factory('loc', function() {
  var location = {};

  return {
    setProperty: function(latitude, longitude) {
      location.lat = latitude;
      location.lng = longitude;
    },
    getProperty: function() {
      return location;
    }
  };
});

演示：http://plnkr.co/edit/aWEEEjGmsnwMMtAAUZKV?p=preview

使用工厂将数据从一个控制器传递到AngularJS中的另一个控制器

2 个答案: