0

好的，首先是 Javascript 的简化部分：

//the network values below are later dynamically 
//reloaded at runtime from a remote API
$scope.networks =  [{id: 5, name: "Network 1"}];

$scope.campaign = {
    paths: [
        {offers: [
             {name: "Site1",
              network: $scope.networks[0],
              uri: "http://uri1.com"},
             {name: "Site2",
              network: $scope.networks[0],
              uri: "http://uri2.com"}]}]};

以及 HTML 的相关部分：

<div ng-repeat "path in campaign.paths">
   <div ng-repeat="offer in path.offers">
       <input type="text" ng-model="offer.name" />
       <input type="text" ng-model="offer.uri" />
       <select ng-model="offer.network"
           ng-options="n.id as n.name for n in networks">
       </select>
   </div>
</div>

问题是，每当我尝试将模型设置为 to 时，这总是给我一个空白选项作为第一个选项offer.network。我已阅读 为什么 AngularJS 在选择中包含一个空选项？ 和 AngularJS - 在 select 标签中使用 ng-repeat 添加了额外的空白选项，但它们似乎只适用于顶层的选择（即，不使用 ng-repeat 中的模型）。我的问题是我需要更新作为嵌套 ng-repeat 一部分的模型。

编辑：我还应该包括以下代码；这实际上是在破坏一切。此代码在设置原始数组后运行：

$scope.getNetworks = function () {
    $http.get('/api/networks/nameid'
             ).success(function (data, status, headers, config) {
                 $scope.networks = data;
             });
};
$scope.getNetworks();

上面的后端调用返回一个 {id: id, :name "name"} 形式的对象数组。是的，我可以从服务器端静态填充选择，但我真的很想知道如何在一般情况下使其工作。

4

1 回答 1

2

由于您n.id在下拉列表的理解表达式中使用了，您应该offer.network使用这样的id值预先填充

network: $scope.networks[0].id

由于数据是动态填充的，因此您可以执行以下操作。（出于演示目的，我只是使用一种非常愚蠢的方式来填充值。但你明白了。）

$scope.getNetworks().then(function(data){
    $scope.networks = data;

    //populate the default value
    $scope.campaign.paths[0].offers[0].network = $scope.networks[0].id;
    $scope.campaign.paths[0].offers[1].network = $scope.networks[0].id;
})

Working Demo

于 2013-09-03T02:34:17.563 回答