输入不同参数后将一个参数设置为特定值 - NgSwitch？

Question

我有一个应用程序，您可以在其中向数据库添加或编辑值。

我想这样做，以便当我将一个参数设置为任何值（默认情况下为空）时，第二个参数将设置为特定值。

关于我实际尝试做的事情的进一步解释：

HTML代码：

<form class=form-group>
    <td><label>Status Code</label></td>
    <input type="text" #StatusCode (ngModel)="StatusCodes" value="{{StatusCodes}}">
</form>                                         

<form class=form-group>
    <td><label>Eta</label></td>
    <input type="text" #Eta (ngModel)="Etas" value="{{Etas}}">
</form>
<form class=form-group>
    <td><label>Etd</label></td>
    <input type="text" #Etd (ngModel)="Etds" value="{{Etds}}">
</form>
<form class=form-group>
    <td><label>Ata</label></td>
    <input type="text" #Ata (ngModel)="Atas" value="{{Atas}}">
</form>
<form class=form-group>
    <td><label>Atd</label></td>
    <input type="text" #Atd (ngModel)="Atds" value="{{Atds}}">
</form>

StatusCodes默认值为"announced"，只有Eta有指定值（其他3个为空）。输入 Ata 的值后，我希望 StatusCodes 值自动设置为 "inport"。

我猜在这种情况下可以使用 ngswitch，但我不知道如何使用。在这种情况下，它的语法是什么？

如果有更好的方法来获得这种行为，请告诉我如何实现这一点。

Answer 1

我认为 ngSwitch 对您没有帮助，因为它基本上只是 ngIf 的扩展 - 因此用于显示和隐藏 DOM 元素。到目前为止，最稳健的选择是在 TypeScript 中使用事件显式处理它。

例如，像这样的东西：

<form class=form-group>
    <td><label>Status Code</label></td>
    <input type="text" #StatusCode (ngModel)="StatusCodes" value="{{StatusCodes}}">
</form>                                         

<form class=form-group>
    <td><label>Eta</label></td>
    <input type="text" #Eta (ngModel)="Etas" value="{{Etas}}">
</form>
<form class=form-group>
    <td><label>Etd</label></td>
    <input type="text" #Etd (ngModel)="Etds" value="{{Etds}}">
</form>
<form class=form-group>
    <td><label>Ata</label></td>
    <input type="text" #Ata (ngModel)="Atas" value="{{Atas}}" (change)="updateStatusCode('ata')">
</form>
<form class=form-group>
    <td><label>Atd</label></td>
    <input type="text" #Atd (ngModel)="Atds" value="{{Atds}}">
</form>

然后：

updateStatusCode(type) {
  switch (type) {
    case 'ata':
      /* set status code */
      this.StatusCodes = 'import';
      break;
    case 'atd':
      /* etc */
      break;
    case 'eta':
      /* etc */
      break;
    case 'etd':
      /* etc */
      break;
  }
}

它不是超级优雅，但它将是最容易更改和测试的（如果您要编写单元测试）。

我没有执行上面的代码，所以请记住，您可能需要稍微调整一下。

输入不同参数后将一个参数设置为特定值 - NgSwitch？

Setting one parameter to a certain value upon entering a different parameter - NgSwitch?

angular

ng-switch