Question

这是我的控制器的范围.. 我希望在加载时选择第一个单选按钮我已经尝试了ng-selected =“true”和ng-selected = {{true}}但这不起作用

    <div ng-controller="MyController as myCtrl">
        <div ng-class='myCtrl.themeSelected.bodyClass' class='text-div'>
            <!-- radio buttons -->
            <div class='radio-wrap'>
                <input type="radio" name="theme" ng-value="myCtrl.defaultTheme" ng-model="myCtrl.themeSelected" ng-selected="true"> Default
                <input type="radio" name="theme" ng-value="myCtrl.yellowTheme" ng-model="myCtrl.themeSelected"> Yellow
                <input type="radio" name="theme" ng-value="myCtrl.greenTheme" ng-model="myCtrl.themeSelected"> Green
                <input type="radio" name="theme" ng-value="myCtrl.redTheme" ng-model="myCtrl.themeSelected"> Red
                <input type="radio" name="theme" ng-value="myCtrl.blueTheme" ng-model="myCtrl.themeSelected"> Blue
            </div>
        </div>
    </div>

这里也是默认单选按钮的控制器功能：

myModule.controller('MyController', function(){
this.defaultTheme = {
    bodyClass: false,
    firstDivClass:"grayBackground",
    secondDivClass:"lightGrayBackground"
};
});

Answer 1

您需要在Controller中将this.themeSelected设置为等于要选择的单选按钮的值。因此，在您的情况下，this.themeSelected = this.defaultTheme应预先选择第一个单选按钮。不应该要求ng-selected指令，因为它是确定所选状态的模型。

Example plunkr

Answer 2

您是否阅读过Angular文档？

Angular Documentation (input[radio])

您可以通过这种方式执行此操作，如果您在此示例中插入TextView，则需要创建具有适当数据的对象。但这取决于你需要什么。但我想你想得到类似下面的例子

＆＃13;

ng-value

＆＃13;

var myApp = angular.module('myApp',[]);
myApp.controller('MyController', function($scope){
$scope.defaultTheme = {
    bodyClass: false,
    firstDivClass:"grayBackground",
    secondDivClass:"lightGrayBackground"
};
$scope.themeSelected = 'yellowTheme'
});

＆＃13;

.defaultTheme {
  background-color: white;
}
.yellowTheme {
  background-color: yellow;
}
.greenTheme {
  background-color: green;
}
.redTheme {
  background-color: red;
}
.blueTheme {
  background-color: blue;
}

＆＃13;

Angular.js：如何在加载时选中我的单选按钮？

2 个答案: