javascript - angularjs ng-false-value 设置为空

Question

如果我有一个这样的复选框:

<div ng-repeat="(key,option) in metaItem.fieldOptions">
    <input type="checkbox" 
           name="metaField[]"
           ng-model="issueForView.metaData[subIndex].fieldValue[key]"
           ng-true-value="'{{option.optionValue}}'" 
           ng-false-value="'{{null}}'">     
           {{option.optionPlaceholder}}
</div>

所以 ng-model，issueForView.metaData[subIndex].fieldValue[key] 最初是空的，它是这样的:

{}

假设我点击 vendor 选项，我得到这个:

{"0":"Supplier"}

然后，如果我取消选择，我会得到这个:

{"0":""}

取消选择后我想要的是:

{}

这是为了使其与我正在替换的代码保持一致。有什么建议吗？

Answer 1

编辑 2 - 根据评论修改答案:

从评论中，我了解到您拥有的对象模型遵循以下几行:

metaItem.fieldOptions = 
  {0: {optionValue: "Supplier"}, 
   1: {optionValue: "SomethingA"}, 
   2: {optionValue: "SomethingB"}};

并且您希望选定的值填充 fieldValue 对象。因此，比如说，对于选定的键 0 和 2，将出现以下内容:

issueForView.metaData[subIndex].fieldValue = {0: "Supplier", 2: "SomethingB"};

问题是如果你取消选择 0，你会得到这个:

issueForView.metaData[subIndex].fieldValue = {0: "", 2: "SomethingB"};

但是你想要这个:

issueForView.metaData[subIndex].fieldValue = {2: "SomethingB"};

答案:如果您在 ng-false-value 中分配 undefined，这很容易解决:

<input type="checkbox" 
       ng-model="issueForView.metaData[subIndex].fieldValue[key]" 
       ng-true-value="'{{option.optionValue}}'" ng-false-value="undefined">

plunker

====

原答案:

简单地说，如果为真，您希望ng-model中设置的模型是"some string"，而空对象{} - 如果 false，对吧？

然后，只需将它们设置为 ng-true-value 和 ng-false-value:

<input type="checkbox" 
       ng-model="foo" ng-true-value="'some string'" ng-false-value="{}">

要将其直接应用于您的示例，

<div ng-repeat="(key,option) in metaItem.fieldOptions">
    <input type="checkbox" 
           ng-model="issueForView.metaData[subIndex].fieldValue[key]"
           ng-true-value="'{{option.optionValue}}'" 
           ng-false-value="{}">     
           {{option.optionPlaceholder}}
</div>

编辑:

如果您想将模型设置为一个对象，而不是"some string"，您可以提供一个硬编码的内联对象字面量:

<input type="checkbox" 
       ng-model="foo" ng-true-value="{0: 'Supplier'}" ng-false-value="{}">

在您的示例中，如果此对象是在 ng-repeat 的迭代中动态设置的，那么最好准备好该对象文字。

比如说，你有 option.optionValue === {0: "Supplier"} 用于此迭代(看起来不像你做的，但这是正确的方法，因为对象实际上是一个“选项值”)，那么你可以这样设置它:

<input type="checkbox" 
       ng-model="issueForView.metaData[subIndex].fieldValue[key]" 
       ng-true-value="{{option.optionValue}}" ng-false-value="{}">

如果您没有准备好它并且您需要“即时”构建它，您可以使用 ng-init 来实现。比如说，您示例中的 "0" 来自 option.optionKey，而 "Supplier" 来自 option.optionValue:

<input type="checkbox"
       ng-init="t = {}; t[option.optionKey] = option.optionValue"
       ng-model="issueForView.metaData[subIndex].fieldValue[key]" 
       ng-true-value="{{t}}" ng-false-value="{}">