I have a controller function and I cannot call it inside the directive. I am trying hard. is there any thing Else i am failing to do? please tell me. I have included my code here. I have searched many places followed many answers and now I am stuck at this
(function () {
var app = angular.module("featureModule", ['ngRoute']);
//
app.directive('myGoogleAutocomplete', function () {
return {
replace: true,
require: 'ngModel',
scope: {
ngModel: '=',
googleModel: '=',
onSelect: '&?', // optional callback on selected successfully: 'onPostedBid(googleModel)'
},
template: '<input class="form-control" type="text" style="z-index: 100000;" autocomplete="on">',
link: function ($scope, element, attrs, model)
{
var autocomplete = new google.maps.places.Autocomplete(element[0], googleOptions);
google.maps.event.addListener(autocomplete, 'place_changed', function () {
$scope.$apply(function () {
var place = autocomplete.getPlace();
if (!place.geometry)
{
// User entered the name of a Place that was not suggested and pressed the Enter key, or the Place Details request failed.
model.$setValidity('place', false);
//console.log("No details available for input: '" + place.name + "'");
return;
}
$scope.googleModel = {};
$scope.googleModel.placeId = place.place_id;
$scope.googleModel.latitude = place.geometry.location.lat();
$scope.googleModel.longitude = place.geometry.location.lng();
$scope.googleModel.formattedAddress = place.formatted_address;
if (place.address_components) {
$scope.googleModel.address = [
$scope.extract(place.address_components, 'route'),
$scope.extract(place.address_components, 'street_number')
].join(' ');
}
model.$setViewValue(element.val());
model.$setValidity('place', true);
if (attrs.onSelect)
{
//how to call controller function here?
$scope.onSelect({ $item: $scope.googleModel });
}
});
});
}
}
});
app.controller("featureController", function($scope,$http,$rootScope,close,ModalService,NgMap) {
console.log($rootScope.permService);
$scope.onSelect=function(val)
{
console.log(val);
}
});
<my-google-autocomplete id="address" name="address" ng-model="task.house_no" google-model="model.googleAddress"
on-select="vm.onSelectGoogleAddress($item)" autocomplete="off" required>
</my-google-autocomplete>
There is no onSelectGoogleAddress() function in the controller. I see only onSelect() function. Change on-select value passed in the html.
<my-google-autocomplete id="address" name="address" ng-model="task.house_no" google-model="model.googleAddress"
on-select="onSelect($item)" autocomplete="off" required>
</my-google-autocomplete>