Question

我想将一个布尔值保存到我的范围中，但是在表单中它应该显示为“active”或“inactive”。因此，我没有将其直接保存到$ scope，而是根据所选项目创建了一个保存布尔值的函数。

HTML

<ui-select ng-model="statusTemp" id="sStatusAnz" name="sStatusAnz"> 
  <ui-select-match placeholder="{{'selectStatus' | translate}}" id="customerNewDropdownStatus">
    {{$select.selected | translate}} 
  </ui-select-match> 
  <ui-select-choices repeat="s in status" ng-click="setStatus($select.selected)">
    {{s}} 
  </ui-select-choices> 
</ui-select>

的js

 $scope.editCustomer = { };   
 $scope.status = ['active', 'inactive'];
 $scope.setStatus = function(selected){
    console.log("setStatus(",selected,")");
    if( selected == "active" ){

        $scope.editCustomer.status = true;
    }else{
        $scope.editCustomer.status = false;
    }
}

函数userInputDetected（）可以忽略，因为它暂时不执行任何操作。没有手表元素或类似的东西。当我尝试选择一个选项时，控制台仍会记录此信息：

setStatus( true )
setStatus( active )

或

setStatus( false )
setStatus( inactive )

由于项目使用uglify并将所有内容放在一个JS中很难调试。有没有人有同样的问题或知道发生了什么？提前谢谢！

Answer 1

我认为它正在发生，因为您将事件绑定到ng-click，并且从dropdropdown中选择一个选项，您始终必须执行两次单击。由于您使用的是angular-ui，因此您应该使用＆＃34; on-select＆＃34; ui-select中的指令。

用法：

<ui-select ng-model="editCustomer.status" on-select="someFunction($item, $model)">

来自文档：

在选择项目时发生

Answer 2

这可能与以下事实有关：ng-click直接分配给元素，并且它们可能重叠，因为它们可能是虚拟/非标准元素（并且取决于angular-bootstrap是否使用replace：true或不是这些）。

最安全的方法是拥有自己的元素，例如跨度，并为其指定ng-click：

<ui-select-choices repeat="s in status">
  <span ng-click="setStatus($select.selected)">{{s}} </span>
</ui-select-choices>

只需单击一次即可调用函数两次

2 个答案: