AngularJS Material - ng-checked на md-radio-button с ng-value в качестве объекта
Я огляделся, чтобы увидеть, ответил ли кто-нибудь на это, но, похоже, нет. Я хочу использовать объект, а не строку или целое число в качестве значения переключателя. Это возможно? Не похоже, потому что у меня проблемы с тегами md-radio-button, распознающими выбранный объект, а не строковое или целочисленное значение. Я вижу, что он работает после загрузки страницы, и я что-то выбираю, но не знаю, как проверить переключатель, если значение уже существует. Здесь вы можете увидеть очень простую демонстрацию: https://codepen.io/anon/pen/ZmjrLN
Я пробовал class = "md-checked", чтобы увидеть, работает ли это, но это не так. Пробовал ng-checked = "selectedStatus.Name == status.Name", тоже не работает. По сути ng-checked = "true" тоже не работает.
Я бы подумал, что md-radio-button может работать с объектом!
--- РЕДАКТИРОВАТЬ ДЛЯ УТОЧНЕНИЯ ---
Из ответа ниже, ссылаясь на код из codepen, если я использую тот же объект в $scope.statuses для заполнения $scope.selectedStatus, он действительно выбирает правильный переключатель при загрузке. ОДНАКО в реальном мире $scope.selectedStatus заполняется фактическим статусом с сервера, а $scope.statuses также заполняется из того же вызова. Это одинаковые, но 2 разных объекта.
Короче говоря, я все же хочу отметить правильный, даже если объекты не совсем одинаковые, с ними следует обращаться как с ними, потому что они одинаковы.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
При сравнении объектов ng-checked проверяет, является ли отмеченный тем же объектом или ссылкой, и не проверяет соответствие объекта. Таким образом, чтобы установить выбранную / отмеченную радиокнопку, сделайте так, чтобы значение относилось к объекту. Вот пример обновлений Javascript для вашего кода:
angular
.module('BlankApp')
.controller('AppController', function($scope) {
$scope.statuses = [
{id: 1, Name: 'Active'},
{id: 2, Name: 'Dormant'}
];
$scope.selectedStatus = $scope.statuses[0]; // reference the object directly
});
Или, если значение установлено вне области видимости, и мы должны сравнить, тогда мы можем сравнить вручную, а затем установить selectedStatus, найдя правильный объект и назначив его.
angular
.module('BlankApp')
.controller('AppController', function($scope) {
$scope.statuses = [
{id: 1, Name: 'Active'},
{id: 2, Name: 'Dormant'}
];
$scope.selectedStatus = {id: 1, Name: 'Active'};
// Find the index of the selected that matches on id
let i = $scope.statuses.findIndex((val) => {
return val.id = $scope.selectedStatus.id;
});
$scope.selectedStatus = $scope.statuses[i]
});
Посмотрите, подойдут ли вам указанные выше правки. Хм, учитывая то, что вы сказали, вы должны поместить все это в блок $ watch или что-то подобное.
Это действительно работает. ОДНАКО переменная selectedStatus заполняется объектом с сервера. По сути,
scope.statusesфактически находится в компоненте, который разрешается при вызове состояния, и это состояние заполняется вызовом из базы данных.selectedStatusзаполняется статусом из того же вызова разрешения. Вы понимаете, о чем я? Это тот же объект, но он исходит от сервера. Думаю, я мог бы сделать что-нибудь в функции$onInit, чтобы проверить, заполняется ли статус, и использовать идентификатор, чтобы повторно заполнить его переменной из списка, но это кажется излишним