我在我的 html 文件中有这个：
<select ng-model="selectedCar" ng-change="changedValue(selectedCar)" ng-options="x.license for x in fhu.carList" >
<option value="">Select Car</option>
</select>
如何以及在何处放置我的控制器中的 changedValue 函数？我对这个 Angular 和 JavaScript 有点陌生，所以一个具体的例子会很好。我的控制器在下面，下拉列表填充正在工作......几乎。但这是另一个问题，此时选择更改功能更为重要。
(function() {
var app = angular.module("fhu", []);
app.controller("FhuController", function(){
this.carList = cars;
});
$(document).ready(function(){
var car = {};
$.getJSON("fillingapi.php?action=get_cars",function(data){
var i=0;
for(i=0;i<data.length;i++){
cars.push( {license: data[i].license, descr: data[i].descr});
}
});
});
var cars=[];
})();
回答您的问题：“将 changedValue 放在我的控制器中的何处”您已经通过 ng-model="selectedCar" 获得了。Angular 会为你更新它。因此，在您的控制器中，您可以执行 $scope.selectedCar 并获取从下拉列表中选择的汽车。
稍微解释一下：
您正在混合 angular 和 jquery。这不是禁止的，但它并没有真正添加任何东西，并且可能会使事情复杂化。他们对如何操纵视图有不同的策略。
Angular 有双向绑定。当文档准备好时，您不需要收听。这是jquery代码。Angular 会自动为你更新范围和视图。
同样在 angularJS 中使用这个关键字会导致一些范围问题，请改用 $scope 。
您正在使用 jquery 的 $.getJSON 获取数据。您可以改用 angular $http 组件。
我用工作示例做了一个plunker：https ://plnkr.co/edit/1xqvFVTed9I7lJj9NkFH?p = preview
var app = angular.module('fhu', []);
app.controller('FhuController', function($scope, CarService) {
$scope.selectedCar;
CarService.getCars().then(function(listOfCars) {
console.log(listOfCars);
$scope.carList = listOfCars;
});
$scope.changedValue = function() {
alert('You just selected '+ $scope.selectedCar.licence);
}
});
app.factory('CarService', function($http) {
const getCars = function() {
return $http.get('https://www.rantakallio.fi/fillherup/fillingapi.php?action=get_cars');
};
return { getCars };
});
让我们通过代码：
查看 CarService.getCars() 行。getCars 是名为 CarService 的工厂中的一个函数。我让它返回一个简单的承诺，您需要使用 $http 组件（已注释掉）。
我只是简单地返回承诺并将其解包到控制器中，然后将值放入我的 carList 变量中。当 angular 看到变量已更改时，它会为您更新视图。当您从选择列表中选择时，也会发生同样的情况。因为你把 ng-model="selectedCar" 放在你的视图中，angular 会为你更新模型。因此，您可以在控制器中使用它来做某事。
在代码示例中，您可以看到不需要将值传递给函数。你可以阅读 $scope.selectedCar
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句