控制器函数未在指令内部调用

Question

我有一个控制器函数，但我无法在指令中调用它。我正在努力。还有什么我没能做的吗？请告诉我。我在这里包含了我的代码。我搜索了很多地方，得到了很多答案，现在我被困在这个

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

Answer 1

控制器中没有 onSelectGoogleAddress() 函数。我只看到 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>

Answer 2

您可以在link函数中使用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 是

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

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

控制器函数未在指令内部调用

Controller Function Not called inside Directive

callback

angularjs

angularjs-directive

angularjs-controller