1

尝试做一些我认为很简单的事情，但结果却很烦人。我只是想拥有一个在您使用 ng-checked 指令单击复选框时运行的函数。

这是 HTML：

    <div class="form-group">
        <label class="col-sm-2 control-label">Make Payment Optional</label>
        <div class="col-sm-4 center-checkbox">
            <input type="checkbox"
                   class="center-checkbox"
                   ng-model="formData.optionalPayment"
                   ng-checked="optionalPaymentCheckbox();"
                   validate-servererror="featured"/>
        </div>
    </div>

这是角：

if($scope.formData.optionalPayment === undefined) {
  $scope.formData.optionalPayment = TournamentConst.PAYMENT.OPTIONAL;
}

（此检查仅适用于我第一次加载页面时。）

$scope.optionalPaymentCheckbox = function () {
  if($scope.formData.optionalPayment === TournamentConst.PAYMENT.OPTIONAL) {
    $scope.formData.optionalPayment = TournamentConst.PAYMENT.MANDATORY;
  } else {
    $scope.formData.optionalPayment = TournamentConst.PAYMENT.OPTIONAL;
  }
};

当我加载页面时，这个 ng-checked 函数会无限运行。ng-checked 指令有什么我不知道的，或者是一些小细节还是忘记了？提前致谢。

4

1 回答 1

3

你误解了 的意图ng-checked。您认为它所做的是“在选中复选框时执行此表达式” - 一个事件处理程序指令。

它实际上所做的是checked根据表达式设置属性。这意味着它会在表达式上设置一个监视并在每个摘要中对其进行评估。如果值更改，它会checked相应地设置或取消设置属性。

事实上，文档是ng-checked这样说的：

请注意，此指令不应与 ngModel 一起使用，因为这可能会导致意外行为。

正如@JB Nizet 正确指出的那样，您可以通过完全使用ng-true-valueandng-false-value和删除来在您的特定情况下达到预期的效果ng-checked。

所以你的 HTML 变成：

<div class="form-group">
    <label class="col-sm-2 control-label">Make Payment Optional</label>
    <div class="col-sm-4 center-checkbox">
        <input type="checkbox"
               class="center-checkbox"
               ng-model="formData.optionalPayment"
               ng-true-value="TournamentConst.PAYMENT.MANDATORY"
               ng-false-value="TournamentConst.PAYMENT.OPTIONAL"
               validate-servererror="featured"/>
    </div>
</div>

然后，在您的控制器中，将您的对象填充TournamentConst到范围内，以便模板可以看到它：

$scope.TournamentConst = TournamentConst;

（或者你可以只填充你需要的位）

最后，摆脱整个$scope.optionalPaymentCheckbox功能。不过，您仍然需要代码来设置默认值。

optionalPayment最后一件事：当属性实际上更像 时，调用属性令人困惑paymentType，但这与当前问题无关。

于 2017-01-10T23:18:23.060 回答