Привяжите единственную ng-модель для 2 ng-repeat в кнопке с угловым радио

Question

У меня есть два разных списка, которые мне нужно отображать как один список на странице и показывать в качестве радио элементов на экране. Как определить ng-модель и выбранные значения, если ни один элемент не выбран или по умолчанию, если пользователь выбирает значение по умолчанию.

<script> 
 
    angular.module('valueExample', []) 
 
    .controller('ExampleController', ['$scope', function($scope) { 
 
     $scope.names = ['pizza', 'unicorns', 'robots']; 
 
     $scope.my = { favorite: 'unicorns' }; 
 
    }]); 
 
</script> 
 
<form ng-controller="ExampleController"> 
 
    <h2>Which is your favorite?</h2> 
 
    <label ng-repeat="name in names" for="{{name}}"> 
 
     {{name}} 
 
     <input type="radio" 
 
       ng-model="my.favorite" 
 
       ng-value="name" 
 
       id="{{name}}" 
 
       name="favorite"> 
 
    </label> 
 
    <label ng-repeat="name in names2" for="{{name}}"> 
 
     {{name}} 
 
     <input type="radio" 
 
       ng-model="my.favorite" 
 
       ng-value="name" 
 
       id="{{name}}" 
 
       name="favorite"> 
 
    </label> 
 
    <div>You chose {{my.favorite}}</div> 
 
</form>

имена и names2 2 элементы списка, которые я хочу, чтобы отобразить на одном экране

Answer 1

Как я предложил, вы можете Concat списки и использование нг-повтора соответственно. Или вы можете использовать ng-repeat-start и ng-repeat-end и сделать их соответствующим образом.

angular.module('valueExample', []) 
 
    .controller('ExampleController', function($scope) { 
 
    var names1 = ['pizza1', 'unicorns1', 'robots1']; 
 
    var names2 = ['pizza2', 'unicorns2', 'robots2']; 
 
    $scope.names = names1.concat(names2); 
 
    $scope.my = { 
 
     favorite: 'unicorns1' 
 
    }; 
 
    });

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.5/angular.min.js"></script> 
 
<form ng-app="valueExample" ng-controller="ExampleController"> 
 
    <h2>Which is your favorite?</h2> 
 
    <div ng-repeat="name in names"> 
 
    <input type="radio" ng-model="my.favorite" ng-value="name" /> 
 
    <label>{{name}}</label> 
 
    </div> 
 

 
    <div>You chose {{my.favorite}}</div> 
 
</form>