使用工厂将数据从一个控制器传递到AngularJS中的另一个控制器
[英]Using a factory to pass data from one controller to another controller in AngularJS
问题描述
I'm trying to take in the longitude and latitude values (using the google maps API) from one controller, and sending it to another controller. 
我正在尝试从一个控制器获取经度和纬度值（使用google maps API），然后将其发送到另一个控制器。 To do this, I'm using a factory. 为此，我正在使用工厂。 However, there seems to be a problem with either sending the information into the factory, or reading from it. 但是，将信息发送到工厂或从工厂读取似乎存在问题。
.factory('loc', function(){
var location = {};
return {
setProperty: function(latitude, longitude){
location.lat = latitude;
location.lng = longitude;
},
getProperty: function(){
return location;
}
};
});
The first controller (google maps) 第一个控制器（谷歌地图）
.controller('MapCtrl', function($scope, $ionicLoading,loc) {
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(pos) {
loc.setProperty(pos.coords.latitude, pos.coords.longitude)
...
In the second controller, I have: 在第二个控制器中，我有：
.controller('callCtrl', function($scope,$state,loc) {
$scope.updateTask = function(data) {
task.location_lng = loc.getProperty().lng;
task.location_lat = loc.getProperty().lat;
...
2 个解决方案
解决方案1
0 2016-04-17 02:03:35
See running code here... http://play.ionic.io/app/a24d56659129 在此处查看运行代码... http://play.ionic.io/app/a24d56659129
html 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 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;
}
};
});
More complete example here http://play.ionic.io/app/f4332405a2c1 更完整的示例在这里http://play.ionic.io/app/f4332405a2c1
解决方案2
0 2016-04-17 02:09:40
This Works: 这有效：
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;
}
};
});
Demo : http://plnkr.co/edit/aWEEEjGmsnwMMtAAUZKV?p=preview 演示： http : //plnkr.co/edit/aWEEEjGmsnwMMtAAUZKV?p=preview
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.