0

コントローラ関数があり、その中で呼び出すことはできません。私は懸命に努力しています。それ以外のことはありませんか?私はやっていないのですか?教えてください。私はここに自分のコードを含めました。私は多くの答えを踏襲し、今私は、コントローラにはonSelectGoogleAddress()関数ではありません。このコントローラ関数内で呼び出されていません。

(function() { 
 
    var app = angular.module("featureModule", ['ngRoute']); 
 
// 
 

 
app.directive('myGoogleAutocomplete', function() { 
 
\t return { 
 
\t \t replace: true, 
 
\t \t require: 'ngModel', 
 
\t \t scope: { 
 
\t \t \t ngModel: '=', 
 
\t \t \t googleModel: '=', 
 
\t \t \t onSelect: '&?', \t // optional callback on selected successfully: 'onPostedBid(googleModel)' 
 
\t \t }, 
 
\t \t template: '<input class="form-control" type="text" style="z-index: 100000;" autocomplete="on">', 
 
\t \t link: function ($scope, element, attrs, model) 
 
\t \t { 
 
\t \t \t 
 
\t \t \t var autocomplete = new google.maps.places.Autocomplete(element[0], googleOptions); 
 

 
\t \t \t google.maps.event.addListener(autocomplete, 'place_changed', function() { 
 

 
\t \t \t \t $scope.$apply(function() { 
 
\t \t \t \t \t var place = autocomplete.getPlace(); 
 
\t \t \t \t \t if (!place.geometry) 
 
\t \t \t \t \t { 
 
\t \t \t \t \t \t // User entered the name of a Place that was not suggested and pressed the Enter key, or the Place Details request failed. 
 
\t \t \t \t \t \t model.$setValidity('place', false); 
 
\t \t \t \t \t \t //console.log("No details available for input: '" + place.name + "'"); 
 
\t \t \t \t \t \t return; 
 
\t \t \t \t \t } 
 

 
\t \t \t \t \t $scope.googleModel = {}; 
 
\t \t \t \t \t $scope.googleModel.placeId = place.place_id; 
 
\t \t \t \t \t $scope.googleModel.latitude = place.geometry.location.lat(); 
 
\t \t \t \t \t $scope.googleModel.longitude = place.geometry.location.lng(); 
 
\t \t \t \t \t $scope.googleModel.formattedAddress = place.formatted_address; 
 
\t \t \t \t \t if (place.address_components) { 
 
\t \t \t \t \t \t $scope.googleModel.address = [ 
 
\t \t \t \t \t \t \t $scope.extract(place.address_components, 'route'), 
 
\t \t \t \t \t \t \t $scope.extract(place.address_components, 'street_number') 
 
\t \t \t \t \t \t ].join(' '); 
 
\t \t \t \t \t 
 
\t \t \t \t \t } 
 

 
\t \t \t \t \t model.$setViewValue(element.val()); 
 
\t \t \t \t \t model.$setValidity('place', true); 
 
\t \t \t \t \t if (attrs.onSelect) 
 
\t \t \t \t \t { 
 
\t \t \t \t \t //how to call controller function here? 
 
\t \t \t \t \t \t $scope.onSelect({ $item: $scope.googleModel }); 
 
\t \t \t \t } 
 
\t \t \t \t }); 
 
\t \t \t }); 
 
\t \t } 
 
\t } 
 

 
}); 
 

 

 
app.controller("featureController", function($scope,$http,$rootScope,close,ModalService,NgMap) { 
 
console.log($rootScope.permService); 
 

 
$scope.onSelect=function(val) 
 
{ 
 
\t 
 
\t 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>

答えて

1

で立ち往生しています多くの場所を検索しました。私はonSelect()関数しか見ることができません。 htmlで渡されたon-select値を変更します。

<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> 
4

あなたはリンク関数内elemetを使用して、コールバックイベントをバインドすることができます。

これは例です。それが役に立てば幸い。

app.controller('MainCtrl', function($scope) { 
    $scope.SayHello=function(id){ 
     alert(id); 
    } 
}); 

次のようにディレクティブからのコールバック機能を備えたコントローラは、ディレクティブ

app.directive('dirDemo', function() { 
    return { 
    scope: { 
     okCallback: '&' 
    }, 
    template: '<input type="button" value="Click me" >', 
     link: function (scope, element, attrs) { 

    var param='from directive'; 

     element.bind('click', function() { 
      scope.$apply(function() { 
       scope.okCallback({id:param}); 
      }); 
     }); 
     } 
     } 
    }); 

HTMLが

plunker https://plnkr.co/edit/RbFjFfqR1MDDa3Jwe8Gq?p=preview

作業
<body ng-controller="MainCtrl"> 
    <div dir-demo 
     ok-callback="SayHello(id)" 
    </div> 
</body> 

ありましょうしましょう

関連する問題