角“checked"收音机在预设模式

angular "checked" radio on preset model

本文关键字:模式 收音机 checked quot      更新时间:2023-09-26

我有这个bootstrap/angular模板代码,用于设置图像的对齐方式:

<div ng-repeat="a in attributes">
    <div class="btn-group" data-toggle="buttons">
        <label class="btn btn-white" ng-click="align(a, 0)">
            <input type="radio" name="{{a.id}}" ng-checked="{checked : (a.numericValue === 0)}">
            Left
        </label>
        <label class="btn btn-white" ng-click="align(a, 1)">
            <input type="radio" name="{{a.id}}" ng-checked="{checked : (a.numericValue === 1)}">
            Center
        </label>
        <label class="btn btn-white" ng-click="align(a, 2)">
            <input type="radio" name="{{a.id}}" ng-checked="{checked : (a.numericValue === 2)}">
            Right
        </label>
    </div>
    <div class="clip text-{{align(a)}}">
        <img alt="#" ng-src="a.image">
    </div>
</div>

单击结果按钮,正确地更新了模型,然后该方法返回正确的css类。

当按钮呈现时,状态由bootstrap处理,一切正常。我不能做的是在按钮上设置初始检查状态。

我也尝试使用表达式,但不工作:

{{(a.numericValue == 0) && 'checked' || ''}}

或者:

checked="{{(a.numericValue == 0) && 'checked' || ''}}"

如何设置初始值?

谢谢你,大卫。

我认为你没有正确使用angularJS + radio。查看angularjs doc

你的单选按钮应该是这样的

<input type="radio" ng-model="a.numericValue" value="0"> Left
....
<input type="radio" ng-model="a.numericValue" value="1"> Center
....
<input type="radio" ng-model="a.numericValue" value="2"> Right

因此,要初始化已检查状态,只需将a.numericValur设置为控制器

中所需的初始值
a.numericValue = 0;
AngularJS用单选按钮的value属性检查a.numericValue。