Aurelia

Question

我有 2 个这样的输入：

HTML

<template>
  Input1
  <textarea name="" value.bind="item.input1" placeholder=""></textarea>

  Input2
  <textarea name="" value.bind="item.input2" placeholder=""></textarea>
</template>

TS 文件

import { MyModel } from '../models/mymodel';
export class MyApp {
    constructor() {
    }

    item: MyModel;

    activate(dto: MyModel) {
        this.item = new MyModel();

    }

}

我希望当我在 Input1 中键入文本时，Input2 将绑定到 Input1 中的值，但是当我删除 Input1 中的文本时，该值Input2 不会改变。

例如：

我在 Input1 中键入 Hello World => Input2 值将是：Hello World.

如果我将 Input1 值更改为：Hello => Input2 值仍将是：Hello World

Answer 1

您可以 observe 您的第一个输入进行更改，如果值更改为更长的值，则更新另一个输入，如下所示：

import { observable } from "aurelia-binding";

export class MyModel {
  @observable()
  public input1: string;
  public input2: string;

  public input1Changed(newValue, oldValue) {
    if (!oldValue || (newValue && newValue.length > oldValue.length)) {
      this.input2 = newValue;
    }
  }
}

使用 observable 装饰器和约定命名的方法 input1Changed ([property]Changed)，您可以监听更改并根据需要使用旧值和新值。

Aurelia - 值输入取决于另一个输入

Aurelia - Value input depend on another input

javascript