[英]AngularJS - radio button not updating model
First steps in AngularJS. AngularJS的第一步。 I'm facing a strange problem related to this , but the solution doesn't work to me, maybe I'm missing something (as I said, I'm a really n00b with angular).
我面临着与一个奇怪的问题这个 ,但解决方案不工作对我来说,也许我失去了一些东西(正如我所说的,我是真的有角的n00b)。
I'm my HTML, I'm building some radio buttons like that: 我在我的HTML,我要建这样的一些单选按钮:
<div ng-Controller="PageTwo" >
<h3>General Information > Knowledge About </h3>
<div>
<b>User</b>
<div>
<div ng-repeat="option in userOptions">
<input type="radio" name="userGroups" ng-model="$parent.userSelected" value="{{option.id}}" id="{{option.id}}">{{option.text}}
</div>
</div>
Selected thing: {{userSelected}}
</div>
</div>
This is my related Controller: 这是我相关的控制器:
uxctModule.controller ('PageTwo', function ($scope, ModelData){
$scope.data = ModelData;
$scope.userOptions = [{text:'Option 1', id:0}, {text:'Option 2', id:1}, {text:'Option 3',id:2}, {text:'Option 4', id:3}];;
$scope.userSelected = ModelData.knowledgeAboutUser;
});
The model is the following object 该模型是下面的对象
uxctModule.factory ("ModelData", function () {
var data = {
// more code here
knowledgeAboutUser : 3,
}
return data
});
Now, the problem is that I'm logging in the console the ModelData object, and I've noticed that it's not updating when clicking the radio buttons. 现在,问题在于我在控制台中登录了ModelData对象,并且我注意到单击单选按钮时它没有更新。 I think the binding it's ok: I've tried to change the value in the Model, and the app selects the corresponding radio button.
我认为,结合它的确定:我试过在模型中更改数值,以及应用程序选择相应的单选按钮。
Any help it's really appreciated, I'm stuck on this for hours 任何帮助它真的很感激,我卡在这几个小时
You can remove the intermediate variable $scope.userSelected
: 您可以删除中间变量
$scope.userSelected
:
<div ng-repeat="option in userOptions">
<input type="radio" name="userGroups" ng-model="data.knowledgeAboutUser" value="{{option.id}}" id="{{option.id}}">{{option.text}}
</div>
Selected thing: {{data.knowledgeAboutUser}}
It working fine 工作正常
just change 只是改变
$scope.userSelected
to 至
$scope.userSelected.selected
script 脚本
var app = angular.module('app', []);
app.factory ("ModelData", function () {
var data = {
// more code here
knowledgeAboutUser : 2,
}
return data
});
app.controller("PageTwo", function ($scope, ModelData) {
$scope.userSelected = {};
$scope.userOptions = [{text:'Option 1', id:0}, {text:'Option 2', id:1}, {text:'Option 3',id:2}, {text:'Option 4', id:3}];;
$scope.userSelected.selected = ModelData.knowledgeAboutUser;
});
html HTML
<div ng-app="app" ng-Controller="PageTwo">
<h3>General Information > Knowledge About </h3>
<div> <b>User</b>
<div>
<div ng-repeat="option in userOptions">
<input type="radio" name="userGroups" ng-model="userSelected.selected" value="{{option.id}}" id="{{option.id}}">{{option.text}}
</div>
</div>
{{userSelected.selected}}
</div>
</div>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.