Angular-XEditable e-onChange答案

【问题标题】：Angular-XEditable e-onChangeAngular-XEditable e-onChange
【发布时间】：2015-05-11 01:20:06
【问题描述】：

这是我的代码

<span editable-select="item.text" e-ng-options="p.id as p.name for p in products" e-form="rowform" 
          onbeforesave="checkName($data)" e-required e-name="name" 
          e-onChange="scopeFunction($data)">
      {{ showProductName(item.text) || 'Enter Name of a product' }}
    </span>

是否可以在 e-onChange 中访问控制器的 $scope？

如果我输入 e-onChange="scopeFunction(data)" 它会抛出错误“ReferenceError: scopeFunction not defined”

我想要的是在选择一个新值之后能够更改另一个字段的值。

【问题讨论】：

我还想补充一点，我希望在保存值之前触发更改事件。
不能使用 onaftersave 代替 e-onChange？
你能显示你的控制器的代码吗？
嘿，我想我设法通过 onaftersave 做到了。我决定离开它。 Onaftersave 并不完全符合我的要求，因为我希望当用户在选定的可编辑单元格输入中输入某个值时（在我单击“保存”更改之前）更改另一个单元格的值。
是的，我也有同样的问题。我需要根据第一个单元格的更改来更改第二个单元格。 Xeditable 似乎不允许您在编辑模式下这样做。

标签： angularjs x-editable

【解决方案1】：

使用 angular 的 e-ng-change 代替（使用 'e-'-prefix 作为可编辑元素）：

<span editable-select="item.text" 
    e-ng-options="p.id as p.name for p in products" e-form="rowform" 
    onbeforesave="checkName($data)" e-required e-name="name" 
    e-ng-change="scopeFunction($data)">
        {{ showProductName(item.text) || 'Enter Name of a product' }}
</span>

【讨论】：

【解决方案2】：

使用 e-ng-change="onChange(field)" 和 e-ng-model-options="{allowInvalid:true}" 来触发 onChange 事件

                   <input 
                      type="text" ng-model="newEntity[field.name]"
                      name="{{field.name}}" placeholder="{{field.placeholder}}"
                      value="{{field.defaultValue}}"
                      e-ng-change="onChange(field)"
                      e-ng-model-options="{allowInvalid:true}"
                   />

注意：即使 ng-pattern 为 $invalid，e-ng-model-options 也将有助于跟踪 onChange 事件。查看更多：Angular.js - ng-change not firing when ng-pattern is $invalid

【讨论】：