当下拉菜单发生变化时，调用控制器内部的函数

Calling function inside of a controller when dropdown changes

本文关键字：控制器 调用 内部 函数 下拉菜单 变化      更新时间：2023-09-26

在我的Angular.JS控制器文件中有以下代码:

JBenchApp.controller('CaseListCtrl', ['$scope', '$http', 
  function ($scope, $http) {
      // Case list stuff here
          $http.get('http://10.34.34.46/BenchViewServices/api/Calendar/LA/5/08-27-2015').success(function (response) {
              $scope.cases = response;
          });
          $http.get('http://10.34.34.46/BenchViewServices/api/CourtDept/LA').success(function (response) {
              $scope.departments = response;
          });
  }]);

cases变量包含所选法庭(部门)的事件列表。我想要改变的是，当UI中发生变化时，我能刷新这些情况。例如，部门是下拉列表的一部分，当我更改部门时，我希望更改cases变量以包含新选择的法庭(部门)的事件。此外，我有一个日期选择器，当它发生变化时，我希望case变量包含当前选定法庭(部门)新选定日期的事件。

编辑从这里开始:我明白我可以使用ng-change来绑定$scope函数，像这样:

JBenchApp.controller('CaseListCtrl', ['$scope', '$http', 
  function ($scope, $http) {
      // Case list stuff here
      $scope.getCalendar = function () {
          $http.get('http://10.34.34.46/BenchViewServices/api/Calendar/LA/5/08-27-2015').success(function (response) {
              $scope.cases = response;
          });
      }
          $http.get('http://10.34.34.46/BenchViewServices/api/CourtDept/LA').success(function (response) {
              $scope.departments = response;
          });
  }]);

然而，我也明白为了使用ng-change，我需要一个ng-model。这就引出了两个问题:

  1. 如何设置部门模型，因为它们也是动态加载的?我现在把它设置为$scope.departments，对吗?
  2. 我如何做日历的东西作为日历屏幕加载的初始加载?

在下拉菜单中添加ng-change，如下所示:

<select ng-change="updateCase()">

那么你可以在你的控制器中创建一个函数:

$scope.updateCase = function(){
    var filter = //your logic...
     $scope.cases = filter;
}

你可以使用ng-change，或者在控制器中使用$watch。

您可以使用ng-change指令

之类的
<input ng-model = 'someModel' ng-change = 'someChangeFunction()' />

现在，在你的控制器中，你可以这样写- 

$scope.someChangeFunction = function()
{
   //code to change cases model data
}

你应该修改AngularJS文档- ngChange

相关文章：