【问题标题】:AngularJS way to detect selecting the same <option> in <select> dropdownAngularJS 检测在 <select> 下拉列表中选择相同 <option> 的方法
【发布时间】:2013-12-28 23:05:51
【问题描述】:

ng-change 如果您选择相同的选项,则不会触发。我正在使用下拉框选择排序顺序,并希望选择相同的值以按照相同的条件重新排序。

在 Chrome 上,我无法正常工作。我尝试在选择本身、选项和包含元素上触发 ng-click 事件,但点击似乎没有向上传播。

我尝试过使用ng-focusng-blur,但焦点发生在他们实际选择任何选项之前,并且直到用户在选择一个选项后实际点击远离下拉菜单时才会发生模糊。这可行,但有点奇怪,因为一开始什么都没有发生。

我也尝试过ng-mousedownng-mouseup - mouseup 似乎没有触发,而 mousedown 和焦点一样,在他们选择选项之前触发。

这里有一个非常丑陋的解决方法:Detecting interaction with select box,但它甚至对我都不起作用,因为 mousedown 没有触发。

一定有办法做到这一点!我最后的技巧是基本上从头开始构建一个下拉列表而不使用&lt;select&gt;

【问题讨论】:

  • 或在触发重新排序的选择附近添加一个“刷新”按钮。
  • 这是创建了许多选择替换脚本的众多原因之一。与任何角度无关,与浏览器有关。他们不会在已选择的单个选项上注册事件
  • 我也很害怕......我只会放一个刷新按钮,直到/除非有人想出一些非常棒的东西。

标签: javascript html angularjs drop-down-menu


【解决方案1】:

var app = angular.module("MyApp", []);

app.controller("MyCtrl", function() {
  this.data = ['price', 'user', 'date', 'color'];

  this.sort = function(param) {
    console.log("Sort by : " + param);
  }

});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="MyApp">
  <div ng-controller="MyCtrl as ctrl">
    <select>
      <option ng-click="ctrl.sort(opt)" ng-repeat="opt in ctrl.data">{{opt}}</option>
    </select>
  </div>
</div>

【讨论】:

    猜你喜欢
    • 2014-10-21
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-07-31
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多