Question

我正在尝试使用通过ng-show显示不同元素的单选按钮，我不会在模型中设置默认值。

我有以下示例代码(also fiddle)。

<div ng-app> 
    <input type="radio" ng-model="input" name="input" value="a" />
    <input type="radio" ng-model="input" name="input" value="b" />
    <h2 ng-show="input == 'a'">A</h2>
    <h2 ng-show="input == 'b'">B</h2>
</div>

我尝试使用checked="checked"，但它因角度过度而过度。 ng-checked="true"给出了radiobutton propper check，但它没有将模型设置为'a'。

我知道可以在控制器中解决此问题，但我想在没有任何javascript的情况下完全执行此操作。

Answer 1

使用ng-init http://jsfiddle.net/ysxR9/2/

<div ng-app ng-init="input='a'">

    <input type="radio" ng-model="input" name="input" value="a" /> A <br />
    <input type="radio" ng-model="input" name="input" value="b" /> B <br />

    <br />
    <br />

    <h2 ng-show="input == 'a'">A</h2>
    <h2 ng-show="input == 'b'">B</h2>

</div>

通常它的用法是not quite recommended，但在单一情况下，可以使用它。

ng-init做的是在当前作用域的上下文中执行给定的表达式，即$scope.$eval(expression);这意味着你可以将指令放在任何你想要的地方，只要知道目标作用域：

<div ng-app>

    <input type="radio" ng-model="input" name="input" value="a" ng-init="input='a'" /> A <br />
    <input type="radio" ng-model="input" name="input" value="b" /> B <br />

    <br />
    <br />

    <h2 ng-show="input == 'a'">A</h2>
    <h2 ng-show="input == 'b'">B</h2>

</div>

可以在没有任何javascript的情况下为模型设置默认值

1 个答案: