javascript - 输入 radio 和号码的 ng-model 相同

Question

在我的 html 表单中，我有两种不同类型的输入，其 $scope 变量与模型相同。

我有 3 个单选按钮和一个数字输入字段

<div class="form-group">
  <div class="btn-group" data-toggle="buttons">
    <label class="btn btn-primary">
      <input type="radio" ng-model="article.internal_memory" value="16" name="options" id="option1" > 16GB
    </label>
    <label class="btn btn-primary">
      <input type="radio" ng-model="article.internal_memory" value="32" name="options" id="option2" > 32GB
    </label>
    <label class="btn btn-primary">
      <input type="radio" ng-model="article.internal_memory" value="64" name="options" id="option3" > 64GB
    </label>
  </div>
  <input ng-model="article.internal_memory" id="internal-memory-input" placeholder="Outra" type="number" class="form-control">
</div>

但是，如果我选择其中一个单选按钮输入，它不会设置该值。

同一作用域变量有两个不同的输入会导致冲突吗？

Answer 1

使用ng-value 而不是值

像这样

 <div class="form-group">
      <div class="btn-group" data-toggle="buttons">
        <label class="btn btn-primary">
          <input type="radio" ng-model="article.internal_memory" ng-value="16" name="options" id="option1"> 16GB
        </label>
        <label class="btn btn-primary">
          <input type="radio" ng-model="article.internal_memory" ng-value="32" name="options" id="option2"> 32GB
        </label>
        <label class="btn btn-primary">
          <input type="radio" ng-model="article.internal_memory" ng-value="64" name="options" id="option3"> 64GB
        </label>
      </div>
      <input ng-model="article.internal_memory" id="internal-memory-input" placeholder="Outra" type="number" class="form-control">
    </div>

DEMO