AngularJS FORMs:根据前面的输入获取第二个SELECT BOX的Items

AngularJS FORMs: Fetch Items for second SELECT BOX based on previous input

本文关键字：第二个 获取 SELECT BOX Items 输入 AngularJS 前面 FORMs      更新时间：2023-09-26

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框根据所选的道路名称自动更新。这不是真的。Chrome控制台不会抛出任何错误，"if"条件永远不会满足，"else"块总是被执行。我做错了什么?

Use ng-change 

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

在控制器中添加一个方法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);
   }
 });
相关文章：