javascript - AngularJS 表格 : Fetch Items for second SELECT BOX based on previous input

Question

这里是 PHP 专家，正在尝试使用 AngularJS 构建自动更新表单

我的表单如下所示:

<div ng-app="myapp">
 <div ng-controller="ctrl">
  Select Road Name: <select ng-model="roadname" ng-options="x  for x in roadNames" name="forms_roadName"></select>
  Select Bus Stop Name: <select ng-model="busstopname" ng-options="x  for x in busStopNames"  name="forms_BusStopName"></select>
</div>

我的 javascript 的相关部分是:

var app = angular.module('myapp', []);
app.controller('ctrl', function($scope) {
  $scope.roadNames = function_getRoadNames();
    if ($scope.roadname !== null) {  
     $scope.busstopname = function_getBusStopNames($scope.roadname);
    } else { $scope.busstopname = ["Select Roadname first"]; }
 });

我希望巴士站名称 SELECT BOX 能够根据所选路名自动更新。它没有发生。 Chrome 控制台不会抛出任何错误，永远不会满足“if”条件并且始终执行“else” block 。我做错了什么？

Answer 1

使用 ng-change

 <select ng-change="updateRoad()" ng-model="roadname" ng-options="x  for x in roadNames" name="forms_roadName"></select>

在你的 Controller 中添加一个方法 updateRoad()

app.controller('ctrl', function($scope) {
  $scope.roadNames = function_getRoadNames();
    if ($scope.roadname !== null) {  
     $scope.busstopname = function_getBusStopNames($scope.roadname);
    } else { $scope.busstopname = ["Select Roadname first"]; }

   $scope.updateRoad = function() {
        $scope.busstopname = function_getBusStopNames($scope.roadname);
   }
 });