Angularjs: переключатель не выбирается в соответствии с ngmodel, используя с ngrepeat

Радиокнопка не проверяется по умолчанию в зависимости от значения модели.

angular.module('app', [])
  .controller('MyCtrl', ($scope) => {
  $scope.decideVote ={
    vote: {
     yes: "Yes",
      no: "No",
     maybe: "Maybe"
	  //if i have more values here, i will get more radio buttons 
    } 
  }
  
   //uncomment for testing. 
   $scope.serverVoted= {
   vote: {yes:"Yes"}
   }
 });
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>
<div ng-app="app" ng-controller="MyCtrl">
	<form name="myForm">
		<p>Select Vote</p>
		<ul>
			<li ng-repeat="i in decideVote.vote">
				<label>
            {{i}}
					<input type="radio"  name="same"
                    ng-model="serverVoted.vote" ng-value="i" />
				</label>  
			</li>
		</ul>
	</form>
	<div>

Как упоминалось в документации angularjs, радио должно проверяться автоматически на основе значения модели. Я вставлю сюда рабочий образец, но реальный сценарий выглядит так.

Компонент, определенный как radioButtonsFromJsonObj, может быть много элементов как radioButtonsFromJsonObj и может использовать другой объект Json для заполнения переключателя, но модель одинакова для определенной группы переключателей.

Но когда я снова открываю страницу и модель имеет правильные значения, переключатели не проверяются в соответствии с моделью.

Также фактический сценарий подобен компоненту, генерирующему шаблон, и в том, что привязка передается для динамического получения ngModel для каждого элемента. NgModel устанавливается правильно, но при попытке повторно открыть и прочитать данные с сервера он не проверяется автоматически. Итак, попытался создать тот же сценарий, что и выше. Внутри компонента есть блок инициализации и блок конструктора, просто создавая переменную $ ctrl.

привязка следующая

bindings: {
  model: '=ngModel'
}

в шаблоне есть ngRepeat, а внутри каждой итерации создается такой шаблон.

 <input type="radio"  name="same"  ng-model="$ctrl.model" ng-value="i" />

а основной html может иметь много элементов.

<radioButtonsFromJsonObj ng-model="request.Voting1"> </radioButtonsFromJsonObj >
<radioButtonsFromJsonObj ng-model="request.Voting2"> </radioButtonsFromJsonObj >
1
0
33
2

Ответы 2

serverVoted.vote - это объект, поэтому замените его этим ng-model = "serverVoted.vote.yes"

angular.module('app', [])
  .controller('MyCtrl', ($scope) => {
  $scope.decideVote ={
    vote: {
     yes: "Yes",
      no: "No",
     maybe: "Maybe"
	  //if i have more values here, i will get more radio buttons 
    } 
  }
  
   //uncomment for testing. 
   $scope.serverVoted= {
   vote: {yes:"Yes"}
   }
 });
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>
<div ng-app="app" ng-controller="MyCtrl">
	<form name="myForm">
		<p>Select Vote</p>
		<ul>
			<li ng-repeat="i in decideVote.vote">
				<label>
            {{i}}
					<input type="radio"  name="same"  ng-model="serverVoted.vote.yes" ng-value="i" />
				</label>  
			</li>
		</ul>
	</form>
	<div>

Я не хочу отправлять строку в мою модель, полный объект и выбранное свойство, которые были бы такими в моей модели ng-model = "request.serverVoted.vote: {yes:" Yes "}" вот почему я использую я в опциях

SHK_theTechnoGuru 10.09.2018 09:23

ERRONEOUS

$scope.serverVoted= {
   vote: {yes:"Yes"}
}

Вместо:

 $scope.server = { vote: "Yes" };

ДЕМО

angular.module('app', [])
  .controller('MyCtrl', ($scope) => {
  $scope.decideVote ={
    vote: {
     yes: "Yes",
      no: "No",
     maybe: "Maybe"
	  //if i have more values here, i will get more radio buttons 
    } 
  }
  
   //uncomment for testing. 
   $scope.serverVoted= {vote: "Yes"};
})
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>
<div ng-app="app" ng-controller="MyCtrl">
	<form name="myForm">
		<p>Select Vote</p>
		<ul>
			<li ng-repeat="i in decideVote.vote">
				<label>
            {{i}}
					<input type="radio"  name="same"
                    ng-model="serverVoted.vote" ng-value="i" />
				</label>  
			</li>
		</ul>
	</form>
	<div>

Сэр, я постараюсь сообщить вам. Спасибо

SHK_theTechnoGuru 10.09.2018 10:03

@georgeawg: ng-value ="i" означает, что объект сохраняется с `" yes ":" Yes "`. Это означает, что модель serverVoted.vote будет иметь голос: {"yes": "Yes"} почему модель не может выбрать радио кнопки на основе этого значения? почему мы должны отдавать ему одну-единственную собственность? как то, как вы дали, все еще строка, не так ли?

NeverGiveUp161 10.09.2018 11:43

Другие вопросы по теме