单选按钮的 ng-checked 属性在 Angular 中不起作用答案

【问题标题】：Radio button's ng-checked attribute doesn't work in Angular单选按钮的 ng-checked 属性在 Angular 中不起作用
【发布时间】：2019-01-01 09:38:32
【问题描述】：

我的 Angular 项目中有一个单选按钮

<input type="radio" ...  checked />

但是如果我在 ng-checked ng-checked="true" 或 ng-model="flag" 上替换 checked 属性（其中 flag 是组件的字段，它等于 true）它仍然未经检查。这里有什么问题？

【问题讨论】：

您能否添加一个重新创建问题的 plnkr。另外，您使用的是 AngularJS 而不是 Angular 对吗？
什么是plnkr？我使用 Angular，而不是 AngularJS
plnkr.co 是您可以在线发布运行代码的地方，它通常用于显示示例。此外，如果您使用的是 Angular 2+ 而不是 AngularJS，那么语法 ng-checked 和 ng-model 将不起作用，因为那是 AngularJS

标签： html angular

【解决方案1】：

这很简单，应该可以工作。但可能在代码或控制器中的其他地方您正在更改标志。但以下适用于 AngularJS。

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<body ng-app="">
<input type="radio" ng-checked="true"> Checked radio <br><br>
<input type="radio" ng-checked="false"> Not Checked radio <br><br>
</body>
</html>

但是对于 Angular 2+ here is how 你必须这样做

【讨论】：

谢谢。但是你使用 angularJS 而我项目的 angular 版本是最后一个
检查我更新的答案。我认为您正在使用 Angular 2+ 并尝试使用 Angular 1.x 语法来实现。
如果这能解决您的问题，请考虑接受答案以帮助他人。

【解决方案2】：

ng-checked 和 ng-model 是 AngularJS 语法。

如果你使用 Angular，你必须使用默认的 HTML 语法：

<input type="radio" checked="true"/>

并绑定到组件的属性：
单向：

<input type="radio" [checked]="myProperty"/>

或双向：

<input type="radio" [(ngModel)]="myProperty"/>

"Tour of Heroes" is a really good Tutorial 开始使用 Angular。

【讨论】：