Question

我有＆＃39;建议＆＃39;，一系列建议，如：

{Id: 1, Label: "option 1"},
{Id: 2, Label: "option 2"}

和＆＃39; items＆＃39;，一系列项目，如：

{Id: 1, Name: "Name 1", Recommend: recommendations[0]},
{Id: 2, Name: "Name 2", Recommend: recommendations[1]}

现在，我想显示项目列表，每个项目，显示项目名称和单选按钮组，让用户选择一个可能的＆＃39;推荐＆＃39;选项。

我的HTML看起来像：

<div ng-repeat="i in viewModel.items">
  <div>
    {{i.Name}}
  </div>
  <div class="form-group">
    <label class="control-label col-md-3">Recommend this?</label>
    <div class="col-md-9">
        <div class="radio" ng-repeat="r in viewModel.recommendations">
            <label>
                <input type="radio" ng-model="i.Recommend" ng-value="r"/>
                {{r.Label}}
            </label>
        </div>
    </div>
    {{i.Name}}, {{i.Recommend.Label}}
  </div>
</div>
{{viewModel.items | json}}

当我单击每个项目的一个选项时，我看到相应的Recommend.Label正在正确更改，因此它似乎必须模型确定。

我的问题是，在初始页面加载时，每个项目的单选按钮组都没有显示当前选项，即使项目＆＃39;似乎有一个可能的推荐对象。（未选中所有单选按钮）。我错过了什么？

Answer 1

您应该设置项目＆＃34;推荐＆＃34;值开始时绑定到$ scope.recommendations。

angular.module('test', []).controller('testCtrl', function($scope) {
$scope.viewModel = {};
$scope.viewModel.recommendations = [{Id: 1, Label: "option 1"}, {Id: 2, Label: "option 2"}];
$scope.viewModel.items = [{Id: 1, Name: "Name 1", Recommend: $scope.viewModel.recommendations[0]}, {Id: 2, Name: "Name 2", Recommend: $scope.viewModel.recommendations[1]}]; });

jsFiddle：http://jsfiddle.net/rkgetptj/

列表

1 个答案: