65

我有一个模型在 storeLocations 对象中返回一个 isDefault 值。如果 isDefault 返回 true，我不想将组中的单选按钮设置为选中状态。

不确定我是否需要执行 $each(data, function(index,value) 并遍历返回的每个对象，或者是否有更简单的方法可以使用角度构造来执行此操作。

目的：

storeLocations = [
 {
  ... more values,
  isDefault: true
 }
]

标记：

    <tr ng-repeat="location in merchant.storeLocations">
        <td>{{location.name}}</td>
        <td>{{location.address.address1}}</td>
        <td>{{location.address.address2}}</td>
        <td>{{location.address.city}}</td>
        <td>{{location.address.stateProvince}}</td>
        <td>{{location.address.postalCode}}</td>
        <td>{{location.address.country}}</td>
        <td>{{location.website}}</td>
        <td>{{location.zone}}</td>
        <td><input type="radio" ng-model="location.isDefault" value="{{location.isDefault}}" name="isDefault_group"></td>
4

6 回答 6

75

使用ng-value而不是value.

ng-value="true"

ng-checked由于代码重复，版本更差。

于 2013-11-14T13:26:17.117 回答
60

如果您有一组单选按钮，并且您想设置基于模型检查的单选按钮，那么具有相同value和的单选按钮将ng-model被自动检查。

<input type="radio" value="1" ng-model="myRating" name="rating" class="radio">
<input type="radio" value="2" ng-model="myRating" name="rating" class="radio">
<input type="radio" value="3" ng-model="myRating" name="rating" class="radio">
<input type="radio" value="4" ng-model="myRating" name="rating" class="radio">

如果 的值为myRating“2”，则选择第二个单选按钮。

于 2015-07-04T08:57:16.673 回答
27

我认为更强大并避免isDefault在所有模型中使用 a 的一种方法是使用 ng-attributesng-model和.ng-valueng-checked

ng-model：将值绑定到您的模型。

ng-value：传递给ng-model绑定的值。

ng-checked：被评估的值或表达式。对单选按钮和复选框很有用。

使用示例： 在以下示例中，我有我的模型和我的站点支持的语言列表。要显示支持的不同语言并使用选择语言更新模型，我们可以这样做。

<!-- Radio -->
<div ng-repeat="language in languages">

  <div>
    <label>

      <input ng-model="site.lang"
             ng-value="language"
             ng-checked="(site.lang == language)"
             name="localizationOptions"
             type="radio">

      <span> {{language}} </span>

    </label>
  </div>

</div>
<!-- end of Radio -->

只要评估的表达式为真，我们的模型site.lang就会得到一个值。这将允许您轻松地将其与服务器同步，因为您的模型已经进行了更改。language(site.lang == language)

于 2015-11-24T09:30:58.127 回答
22

最终只使用了内置的 angular 属性ng-checked="model"

于 2013-03-15T20:22:53.567 回答
2

正如问题评论中所讨论的那样，这是您可以做到的一种方法：

  • 当您第一次检索数据时，遍历所有位置并将 storeDefault 设置为当前默认的存储。
  • 在标记中：<input ... ng-model="$parent.storeDefault" value="{{location.id}}">
  • 在保存数据之前，遍历所有的 Mercer.storeLocations 并将 isDefault 设置为 false，但 location.id 比较等于 storeDefault 的商店除外。

以上假设每个位置都有一个保存唯一值的字段（例如，id）。

请注意，使用 $parent.storeDefault 是因为 ng-repeat 创建了一个子作用域，并且我们想在父作用域上操作 storeDefault 参数。

小提琴。

于 2013-01-26T01:24:32.560 回答
1

只要做这样的事情，<input type="radio" ng-disabled="loading" name="dateRange" ng-model="filter.DateRange" value="1" ng-checked="(filter.DateRange == 1)"/>

于 2019-06-21T02:27:02.443 回答