Angular2中的"ng-true-value"和"ng-false-value"替代方案

Question

我正在寻找的ng-true-value和ng-false-value替代品Angular 2,但我没有得到的结果.他们用其他工具取代了吗？我真的需要它们.提前致谢

Answer 1

解决方法。例如，模型中的“对象”带有“标志”，一个复选框应将标志设置为值“1”，另一个复选框应将标志设置为值“2”，如果复选框均未选中，则值应为“0”，所以：

public setFlag(object: any, event: any): any {
  if (event.target.classList.contains('some-mark-class') && (object.flag == 0 || object.flag == 1)) {
    object.flag = 2;
  } else if (!event.target.classList.contains('some-mark-class') && (object.flag == 0 || object.flag == 2)) {
    object.flag = 1;
  } else {
    object.flag = 0;
  }
}

<input type="checkbox" name="hide-{{object.flag}}" [checked]="object.flag === 1" (change)="setFlag(object, $event)">
<input type="checkbox" name="dlte-{{object.flag}}" [checked]="object.flag === 2" (change)="setFlag(object, $event)" class="some-mark-class">

该解决方案可能并不完美，而且有些笨拙，但它确实有效，所以如果您有一些改进，请这样做。

如果您愿意的话，当我有更多时间时，我会尝试在一些沙箱中进行操作:)。

更新： 版本 2 更好的方法和灵活性

.ts 文件：

public setFlag(obj: any, property: any, trueValue: any, falseValue: any): any {
  if (obj[property] === trueValue) {
    obj[property] = falseValue;
  } else {
    obj[property] = trueValue;
  }
}

<input type="checkbox" name="hide-{{object.flag}}" [checked]="object.flag === 1" (change)="setFlag(object, 'flag', 1, 0)>
<input type="checkbox" name="dlte-{{object.flag}}" [checked]="object.flag === 1" (change)="setFlag(object, 'flag', 'true-value', 'false-value')>

在函数 setFlag 中，我们采用 4 个参数：对象、对象的属性、真值和假值，这使我们可以灵活地设置我们想要的值，并且无需标记类即可实现。希望能帮助到你