Question

我在选择输入时从我的选项中选择每个方法时使用了ng-change指令来调用方法，但是在我选择一个选项之前调用了这个方法，所以要解决这个问题，这是我的尝试：

    <select ng-model="produitId" ng-model-onblur ng-change="duplicateGammeProduit(produitId)">
        <option ng-repeat="pi in listProduitUsed" value="{{pi.id}}">{{pi.reference}}</option>
    </select>

    app.directive('ngModelOnblur', function() {
        return {
            restrict: 'A',
            require: '^ngModel',
            priority: 1, 
            link: function(scope, elm, attr, ngModelCtrl) {
                if (attr.type === 'radio' || attr.type === 'checkbox') return;

                elm.unbind('select').unbind('change');
                elm.bind('blur', function() {
                    scope.$apply(function() {
                        ngModelCtrl.$setViewValue(elm.val());
                    });         
                });
            }
        };
    })

   .controller(
        'GammeCtrl', [
            '$scope',
            '$http',

            function($scope, $http) {

    $scope.duplicateGammeProduit = function(produitId) {
      $http.get(MyURL:" +produitId).success(
           function(gammeProduit) {                                     
          //the method to be called when an option is selected          
      $scope.classifierListElementGamme(gammeProduit.listElementGamme);
           gammeProduit.id = null
           $scope.gammeCourante.tempsTotal = gammeProduit.tempsTotal;
           $scope.gammeCourante.nbOperation = gammeProduit.nbOperation;                                 
           angular.forEach(gammeProduit.listElementGamme,
                 function(elementGamme, key){
                   elementGamme.id = null;
                });

            $scope.finalOperationsList = gammeProduit.listElementGamme;
            $scope.formToSave.finalOperationsList = $scope.finalOperationsList;
          });
       }

  $scope.listeProduitUsed = function() {
                $http
                    .get(URL/getProduitListUsed")
                    .success(
                        function(dataProduit) {

                            $scope.listProduitUsed = dataProduit;
                        });}
      $scope.listeProduitUsed();

}]);

但是现在我还有另一个错误，即ng-change方法不起作用请帮忙谢谢你的帮助

Answer 1

试试这个

<select
   ng-options="pi.id as pi.reference for pi in listProduitUsed" 
   ng-model="produitId" ng-change="duplicateGammeProduit(produitId)"></select>

Answer 2

尝试这样。

var app = angular.module("app",[]);

app.controller("MyCtrl" , function($scope){
   $scope.items = [{name:"ali"},{name:"reza"}];
  
  $scope.dropdown = $scope.items[0];
  $scope.duplicateGammeProduit = function(dropdown){
    alert(dropdown);
    }
  
  });
app.directive('ngModelOnblur', function() {
    return {
        restrict: 'A',
        require: '^ngModel',
        priority: 1, 
        link: function(scope, elm, attr, ngModelCtrl) {
            if (attr.type === 'radio' || attr.type === 'checkbox') return;

            elm.unbind('select').unbind('change');
            elm.bind('blur', function() {
                scope.$apply(function() {
                    ngModelCtrl.$setViewValue(elm.val());
                });         
            });
        }
    };
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="app" ng-controller="MyCtrl">
   
  <select ng-model="dropdown" ng-options="item as item.name for item in items" ng-model-onblur ng-change="duplicateGammeProduit(dropdown)">
        <option value="">--- Select an item---</option> 
       
    </select>  
</div>

ng-change不适用于选择输入

2 个答案: