在angular2中反转复选框值答案

【问题标题】：Reverse checkbox value in angular2在angular2中反转复选框值
【发布时间】：2017-11-17 08:22:19
【问题描述】：

在 Angular 2 中反转复选框值时遇到一些麻烦。

在 Angular 1.x 中，我们可以编写如下指令。

.directive('invertValue', function() {
  return {
    require: 'ngModel',
    link: function(scope, element, attrs, ngModel) {
      ngModel.$parsers.unshift(function(val) { return !val; });
      ngModel.$formatters.unshift(function(val) { return !val; });
    }
  };
})

【问题讨论】：

你的意思是如果它是真的就让它假？
是的，我的对象中的值是 true，但是复选框应该显示为 false。无需将 ngModel 更改为 false。我希望将其创建为指令，以便像上面的代码一样可重用

标签： javascript angular checkbox

【解决方案1】：

为什么你需要指令来处理这个简单的事情

你可以这样实现

<input type="checkbox" [checked]="!value" (change)="value= !value" />

【讨论】：

有人知道这个解决方案的缺点吗？例如，通过从元素中省略 ngModel？因为这是我的第一个解决方案，但我无法让 ngModel 反转。现在看起来不错:)