Question

我使用angularJs和xeditables来创建Web应用程序在这个应用程序中，我有几个xeditable文本跟随彼此，并在按Enter键或外部点击时完成验证：

<div ng-repeat="answer in item.answers track by $index">    
    <input type="radio" name="{{item.label.text}}">&nbsp;<span editable-text="answer.text" onshow="onShow()" onhide="onClose()" buttons="no" blur="submit" onbeforesave="validateEditableText($data)">{{answer.text || "Edit this text"}}</span>
</div>

我的函数onShow（）和onClose（）如下：

$scope.onShow = function() {
  alert('onShow');
  if($scope.hideMenu == true)
    $scope.hideMenu = false;
};

$scope.onClose = function() {
      alert('onClose');
      if($scope.hideMenu == false)
        $scope.hideMenu = true;
    };

这些函数只是将布尔值更改为true 我使用这个布尔来停止或不停止事件传播（这可能听起来很奇怪，但我需要这个功能）。

这是我阻止事件传播的函数，但是你不必为了解释它而完全理解它：

$scope.blocEventPropagation = function(event) {
  if($scope.selectedItem != null){
    if($scope.hideMenu && !$scope.selectedItem.dropDownOpen)
      event.stopPropagation();
    }
};

实际上我遇到的问题是，当我点击可修改的文本然后直接点击另一个时，事件不会按照我想要的顺序进行。
我点击它时第一个可修改文本的onShow()，当我在关闭第一个和onShow()之前直接点击它时，onClose()。
我点击第一个onShow()时的onClose()，第一个点击第二个onShow()时//THIS WORKS!!! f0_mem = clCreateBuffer( context, CL_MEM_READ_WRITE | CL_MEM_ALLOC_HOST_PTR, sizeof (int)*(capacity + 1), NULL, &err); f1_mem = (..."the same as above"...); m_d_mem = clCreateBuffer(..., CL_MEM_WRITE_ONLY | CL_MEM_ALLOC_HOST_PTR, sizeof (int)*capacity,...); for (int k = 0; k < numelem; k++) { sumK = sumK - weight[k]; cmax = 0; cmax = max(capacity - sumK, weight[k]); total_elements = (size_t) (capacity - cmax + 1); if (k % 2 == 0) { //clEnqueueWriteBuffer of cl_mem buffers writeBufferToDevice(f0_mem, f1_mem, f0, f1); setKernelArgs(f0_mem, f1_mem, weight[k], value[k], (int) total_elements); } else { //clEnqueueWriteBuffer of cl_mem buffers writeBufferToDevice(f1_mem, f0_mem, f1, f0); setKernelArgs(f1_mem, f0_mem, weight[k], value[k], (int) total_elements); } err = clEnqueueNDRangeKernel(queue, kernel, 1, NULL, global_work_items, NULL, 0, NULL, NULL); //clEnqueueReadBuffer of cl_mem buffers readBufferFromDevice(f0_mem, f1_mem, m_d_mem, f0, f1, m_d); memcpy(M + k*capacity, m_d, sizeof (int)*capacity); }。void kernel knapsack(global int *input_f, global int *output_f, global int *m_d, int cmax, int weightk, int pk, int maxelem){ int c = get_global_id(0)+cmax; if(get_global_id(0) < maxelem){ if(input_f[c] < input_f[c - weightk] + pk){ output_f[c] = input_f[c - weightk] + pk; m_d[c-1] = 1; } else{ output_f[c] = input_f[c]; } } }。

在这一点上阅读xeditable的所有文档，我没有找到解决方案。我试图使用超时等待其他事件，但它没有工作。

您是否有想法更改事件顺序或限制功能调用或甚至是我没有想到的其他解决方案？

Answer 1

您可以让所有元素在隐藏菜单时单独作出贡献：

  <div ng-repeat="answer in item.answers track by $index">    
        <input type="radio" name="{{item.label.text}}">&nbsp;<span editable-text="answer.text" onshow="{{$scope.hideMenu[$index] = true;}}" onhide="{{$scope.hideMenu[$index] = false;}}" buttons="no" blur="submit" onbeforesave="validateEditableText($data)">{{answer.text || "Edit this text"}}</span>
  </div>

然后，如果显示任何元素，则隐藏它：

<div id="menu" ng-hide="{{$scope.hideMenu.indexOf(true) >= 0}}" />

可能存在语法错误，但我希望它澄清了这一点。

Answer 2

最后我找到了解决方案：

$scope.count = 0;

$scope.onShow = function() {
  $scope.count ++;
  if($scope.hideMenu == true)
    $scope.hideMenu = false;
};

$scope.onClose = function() {
  $scope.count --;
  if($scope.hideMenu == false && $scope.count == 0)
    $scope.hideMenu = true;
};

这个解决方案非常难看，但我真的认为，凭借我的实际知识，在这种非常具体的情况下，它更好。我试图找到一个更好的但我无法做到实际上，如果我们在onShow()中使用onClose()和ng-repeat并使用$index，则之前的答案会有效。但是我在应用程序的不同位置使用这两个函数，因此我无法获得索引。

如何更改x-editable事件顺序？

2 个答案: