0

我试图检测何时从 AngularJS 选择的 localytics 下拉列表中选择一个选项。

这是下拉菜单的代码：

<select chosen data-placeholder="Buscar..." 
    class="w-100" 
    ng-model = "medSearchType"
    ng-change = "changeMedSearch(medSearchType)">
        <option value="Medicamento">Medicamento</option>
        <option value="Componente">Componentes Activos</option>
</select>

在我的控制器中，我具有以下功能：

$scope.changeMedSearch = function (searchType) {
    console.log(searchType);
}

它第一次工作正常，但如果我想在控制台中选择另一个选项，我会收到以下错误，并且下拉菜单不会选择我想选择的另一个选项：

未捕获的类型错误：无法设置未定义的属性“已选择”

我该如何解决这个问题？

非常感谢。

4

3 回答 3

0

我听从了 MrJSingh 的建议并使用了 ng-options，但问题仍然存在。

然后我加了一个空的，它终于起作用了

<select chosen data-placeholder="Buscar..." 
     ng-model = "medSearch"
     ng-change = "changeMedSearch(medSearch)"
     ng-options = "size as size for size in medSearchTypes">
     <option></option>
</select>
于 2016-08-13T20:08:59.753 回答
0

脚本.js

App.controller('permissionManagerController', ['$scope', '$http', '$q', 'ngToast', '$uibModal', '$window', 'permissionManagerRepository', function ($scope, $http, $q, ngToast, $uibModal, $window, PermissionManagerRepository) {

    var ctrl = this;

    // Variables
    $scope.testitem = 103; 
    $scope.search = {
        country: null,
        ...
    };
    $scope.lists = {
        countries : [],
        ...
    };
    // Methods
    ctrl.init = function () {
        var promises = {
            countries: PermissionManagerRepository.getCountries(),
            ...
        };
        $q.all(promises).then(function succes(values) {
            $scope.lists.countries = values.countries;
            ...
        }, function errorCallback(xhr, ajaxOptions, thrownError) {
            console.log("REST API call failed with status: " + xhr.status + " and error: " + thrownError);
        });
    };
    // Utilities
    $scope.reloadAffiliates = function (idCountry) {
        $scope.search.country = country;
        if (idCountry) {
            var promises = {
                affilates: PermissionManagerRepository.getAffiliatesByCountry(idCountry)
            };
            $q.all(promises).then(function succes(values) {
                $scope.lists.affilates = values.affilates;
            }, function errorCallback(xhr, ajaxOptions, thrownError) {
                console.log("REST API call failed with status: " + xhr.status + " and error: " + thrownError);
            });
        }   
    };
}]);

不工作的例子

<select chosen
        data-placeholder-text-single="'Chose countries...'"
        allow-single-deselect="true"
        search-contains="true"
        class="form-control"
        ng-model="search.country"
        ng-options="ct.IdCountry as ct.CountryNm for ct in lists.countries"
        ng-change="reloadAffiliates(search.country)">
</select>

在这种情况下，当由于用户选择一个选项而触发change事件时， search.country将 id 作为值。否则，如果用户单击 ，<abbr class="search-choice-close"></abbr>则这些值不是null分配给变量的最后一个值。

工作示例

<select chosen
        data-placeholder-text-single="'Chose countries...'"
        allow-single-deselect="true"
        search-contains="true"
        class="form-control"
        ng-model="search.country"
        ng-options="ct.IdCountry as ct.CountryNm for ct in lists.countries"
        ng-change="reloadAffiliates(search.country)">
    <option value=""></option>
</select>

在这种情况下，当由于用户选择一个选项而触发change事件时， search.country将 id 作为值。否则，如果用户单击 ，<abbr class="search-choice-close"></abbr>则值为null。

于 2020-03-04T16:24:28.457 回答
-2

尝试改用 ng-options。

angular.module("app",[]).controller("ctrl",function($scope){
    $scope.items = [1,2,3,4,5,6]
    $scope.changeMedSearch = function(medSearchType){
      alert(medSearchType)
    }
  })
<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script>
  
</head>
<body ng-app="app" ng-controller="ctrl">
  <select ng-model = "medSearchType"
    ng-change = "changeMedSearch(medSearchType)" ng-options="size as size for size in items" 
   ng-model="item" ng-change="update()"></select>
</body>
</html>

于 2016-08-13T18:57:49.997 回答