如何跟踪 aurelia 中表单对象的更改以激活还原按钮

Question

我们正在使用 Aurelia 创建一个单页应用程序，其中我们是 creating/Editing 员工详细信息。在编辑员工表单中，我们需要提供恢复本地更改（如果有）的功能。但诀窍是如果没有本地更改

禁用按钮

我尝试使用 computedFrom，但它只观察属性而不是复杂对象。

这是一个示例代码 -

import {bindable, computedFrom} from 'aurelia-framework'


export class Employee {
  @bindable employee
  
  @computedFrom('employee')
  enableRevert() {
    return true;
  }
  
  revert() {
   // revert functionality goes here
  }
}

感谢您的帮助！

Answer 1

employee.html

<button disabled.bind="!hasChanged()">Revert</button>

employee.js

attached() {
    Object.assign(this.originalEmployee, employee);
}

hasChanged() {
    // Like @Favio said, iterate over an original copy of the employee object.
    for (let p in employee) {
        if (employee[p] !== this.originalEmployee[p]) {
            return true;
        }
    }

    return false;
}

如何跟踪 aurelia 中表单对象的更改以激活还原按钮

How to track changes in form object in aurelia to activate revert button

javascript

single-page-application

aurelia