javascript - AngularJS 自定义过滤器在选择下拉菜单上触发

Question

我是 AngularJS 新手。我有一个像这样的自定义过滤器。

app.filter('makeUppercase', function () {
  return function (item) {
    return item.toUpperCase();
  };
});

在 ng-change 上，我想触发我的自定义过滤器。意思是，当用户选择 option1 时我想触发上面的过滤器。

  <md-select ng-model="myModel" ng-change="" placeholder="Select an option">

Answer 1

尝试这个解决方案。

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope, $filter) {

  $scope.option = ["option01", "option02", "option03"];

  angular.element(document.querySelector('#option')).on('change', function() {    
    var a = this.selectedOptions[0].label;
    console.log(a);
    $scope.result = $filter('makeUppercase')(a);
    console.log($scope.result);
  })

});
app.filter('makeUppercase', function() {
  return function(item) {
    console.log("OK");
    return item.toUpperCase();
  };
})

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">
  <select id="option" ng-model="selectedName" ng-options="x for x in option ">
</select>

</div>