ドロップダウンからオプションを選択したときに角度関数をトリガー

apiを呼び出して選択ドロップダウンメニューに値を設定しています。ユーザーが選択メニューからオプションを選択すると、私は第2の機能を起動させたい - $scope.getRoles()。しかし、これはすぐに発砲しています。これがなぜ起こっているのか？以下の私の試みたコードを見てください。ドロップダウンからオプションを選択したときに角度関数をトリガー

HTML

<select> 
    <option ng-change="getRoles()" ng-repeat="country in countries">{{ country.countryCode }}</option> 
</select>

角度

app.controller("jobsCtrl", function($scope, careerData) { 

    //get list of countries when app loads 
    careerData.countryList().then(function successCallback(response) { 
      $scope.countries = response.data; 
      $scope.countries.unshift({countryCode: "Select a country"}); 
     }, function errorCallback(response) { 
      console.log(response); 
    }); 

    $scope.getRoles = careerData.jobByCountry().then(function successCallback(response) { 
      console.log(response) 
     }, function errorCallback(response) { 
      console.log(response); 
    }) 
}); 

app.factory('careerData', ['$http', function($http){ 
return { 

    countryList: function() { 
     return $http({ 
      method: 'GET', 
      url: 'testUrl' 
     }) 
    }, 

    jobByCountry: function() { 
     return $http({ 
      method: 'GET', 
      url: 'someurl' 
     }) 
    } 
} 
}]);

出典

2016-07-11 Anonymous

第1のものは、 'ng-model'を' select'に追加し、 'ng-change'指示文を' option'に置くのではなく、選択要素に置きます。 –

「

まずはngOptionsを使用する必要があります。用

<select> 
    <option ng-change="getRoles()" ng-repeat="country in countries">{{ country.countryCode }}</option> 
</select>

：

変更この

<select ng-options="country as country.countryCode for country in countries" ng-model="countrySelected" ng-change="getRoles()"> 
</select>

例：

angular.module('app', []) 
 
    .controller('mainCtrl', function($scope) { 
 
    $scope.cars = ["Audi", "BMW", "Corolla", "Mercedes"]; 
 

 
    $scope.check = function() { 
 
     console.log($scope.car); 
 
    } 
 
    });

<!DOCTYPE html> 
 
<html ng-app="app"> 
 

 
<head> 
 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.7/angular.min.js"></script> 
 
</head> 
 

 
<body ng-controller="mainCtrl"> 
 
    Cars: 
 
    <select ng-model="car" ng-options="car for car in cars" ng-change="check()"> 
 
     <option value="">Select a car</option> 
 
    </select> 
 
</body> 
 

 
</html>

出典

2016-07-11 16:22:29 developer033

私はこれが変更前にまだ発砲していると言うことができますから！ –

できません。 – developer033

@phantom、上記を確認してください。選択前に呼び出された関数への呼び出しはありません。 – developer033

ドロップダウンからオプションを選択したときに角度関数をトリガー

答えて

関連する問題