3

ng-change选择先前选择的选项后不会被解雇。因此，我无法处理相同的下一个选择。

<select ng-model="selectedOption" ng-change="handleSelection()">                        
    <option value="A" selected>A</option>
    <option value="B">B</option>
    <option value="C">C</option>
    <option value="D">D</option>
</select>

我想向用户显示最后选择的选项并希望处理它。但是由于ng-model在下一个相同的选项上没有改变，因此选择ng-change不会被解雇。

如何处理这种情况？

4

3 回答 3

0

您可以ng-change通过仅检查点击次数来做到这一点：

click event每次开盘后的第一次加注select

click event选择一项后第二次加薪

我们用来blur event在失去焦点后清除点击次数

change event通过这种方式，您将获得不带and的选定项目without selecting new item：

<select ng-model="selectedOption" ng-click="handleSelection()" ng-blur="resetClickCount()">                        
    <option value="A" selected>A</option>
    <option value="B">B</option>
    <option value="C">C</option>
    <option value="D">D</option>
</select>

--

app.controller("myCtrl", function($scope) {
    $scope.clickCount = 0;

    $scope.handleSelection = function() {
        $scope.clickCount++;
        if ($scope.clickCount==2) {
            alert($scope.selectedOption);
            $scope.clickCount = 0;
        }
    }

    $scope.resetClickCount = function() {
        $scope.clickCount = 0;
    }
});
于 2017-01-04T07:07:46.490 回答
0

尝试在控制器中定义selectedOption值，而不是使用“ selected ”属性。

要跟踪先前选择的选项，您可以使用 $scope 变量并在handleSelection()函数的末尾更改它。这里有一个工作演示- jsfiddle.net ` 

$scope.selectedOption = "A";
$scope.lastSelectedOption = "A";
$scope.handleSelection = function(){
console.log("Selected Item: "+$scope.selectedOption);
console.log("Last Selected Item:" + $scope.lastSelectedOption);
console.log("");
$scope.lastSelectedOption = $scope.selectedOption;
}`
于 2017-01-04T07:39:02.230 回答
0

如果值发生变化，您应该使用“ng-change”。在您的情况下，您希望在值未更改时处理事件，因此您可以使用“ng-click”来处理相同的选项选择。

演示：http: //jsfiddle.net/Despotix/vgw5bxrq/3/

<div ng-controller="MyCtrl">
  <select ng-model="selectedOption" ng-click="click()">
          <option value="A" selected>A</option>
          <option value="B" class="option">B</option>
          <option value="C" class="option">C</option>
          <option value="D" class="option">D</option>
   </select>
    {{seletedQueue}}
</div>

--

var myApp = angular.module('myApp', []);

function MyCtrl($scope) {
    $scope.seletedQueue = '';
    $scope.click = function(item) {
        $scope.seletedQueue += '->' + $scope.selectedOption;
    }
}

您可以选择两次（或更多）相同的选项：->B->B->A

于 2017-01-03T14:30:41.663 回答