gpt4 book ai didi

javascript - 外部 Controller 指令中 Controller 的调用函数

转载 作者:行者123 更新时间:2023-12-02 14:39:34 24 4
gpt4 key购买 nike

我正在创建一个 ionic 应用程序,可用于 map 上的研究和路线。您输入所需的位置,它已经为您提供了从当前位置到所需位置的路线。它工作得很好。唯一的问题是我需要调用 map Controller 内的函数,并且需要在 Controller 外部的指令工作之后运行该函数。简而言之,我需要在指令中调用 Controller 的函数。我在互联网上和 SO 中看到了一些例子,但这些例子我都无法成功,我希望你能帮助我。

示例:

.controller("atigmaps", function($ scope, $ state, $ ionicModal, $ rootScope) {
$ Scope.load_map = function() {
/// ...
}
})

.directive('example', function($ ionicModal, LocationService) {
$ Scope.choosePlace = function(place) {
LocationService.getDetails(place.place_id).then(function(location) {
$ Scope.location = location;
$ Scope.close();
$ Scope.load_map() < -- - This

function is within the controller
});
};
}

我的功能

var geocoder;
var map;
var marker;



geocoder = new google.maps.Geocoder();

marker = new google.maps.Marker({
map: $scope.model.myMap,
draggable: true,
icon:'pin_route.png',
});





function carregarNoMapa(endereco) {

geocoder.geocode({ 'address': endereco + ', Brasil', 'region': 'BR' }, function (results, status) {
if (status == google.maps.GeocoderStatus.OK) {
if (results[0]) {
var latitude = results[0].geometry.location.lat();
var longitude = results[0].geometry.location.lng();

$('#txtEndereco').val(results[0].formatted_address);
$('#txtLatitude').val(latitude);
$('#txtLongitude').val(longitude);
$('#dest').val(document.getElementById('txtEndereco').value);





$scope.atualizalocation();

var location = new google.maps.LatLng(latitude, longitude);
marker.setPosition(location);
$scope.calcRoute();
$scope.model.myMap.setCenter(location);
$scope.model.myMap.setZoom(15);

}
}
});
}

我的指令

.directive('locationSuggestion', function($ionicModal, LocationService){
return {
restrict: 'A',
scope: {
location: '='
},
link: function($scope, element){
console.log('locationSuggestion started!');
$scope.search = {};
$scope.search.suggestions = [];
$scope.search.query = "";
$ionicModal.fromTemplateUrl('location.html', {
scope: $scope,
focusFirstInput: true
}).then(function(modal) {
$scope.modal = modal;
});
element[0].addEventListener('focus', function(event) {
$scope.open();
});
$scope.$watch('search.query', function(newValue) {
if (newValue) {
LocationService.searchAddress(newValue).then(function(result) {
$scope.search.error = null;
$scope.search.suggestions = result;
}, function(status){
$scope.search.error = "There was an error :( " + status;
});
};
$scope.open = function() {
$scope.modal.show();
};
$scope.close = function() {
$scope.modal.hide();
};






$scope.choosePlace = function(place) {
LocationService.getDetails(place.place_id).then(function(location) {
$scope.location = location;
$scope.close();








});
};
});
}
}




})

最佳答案

您应该将函数包含在工厂中,将工厂包含在 Controller 和指令中,然后调用该函数,例如:MyFactory.load_map()

示例:

工厂.js

angular.module('starter.factoryServices', [])

.factory('MyFactory', function($q) {

return {
load_map : function() {
/// ...
}
}


});

您的代码:

.controller("atigmaps", function($ scope, $ state, $ ionicModal, $ rootScope, MyFactory) {

})

.directive('example', function($ ionicModal, LocationService, MyFactory) {
$ Scope.choosePlace = function(place) {
LocationService.getDetails(place.place_id).then(function(location) {
$ Scope.location = location;
$ Scope.close();
MyFactory.load_map();

});
};
}

在你的 Angular 模块中:

angular.module('starter', ['ionic', 'starter.factoryServices'])

还有index.html,添加引用

<script src="path/myFactory.js"></script>

关于javascript - 外部 Controller 指令中 Controller 的调用函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37131851/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com