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 には select に空のオプションが含まれているのですか ? AngularJS - select tagで 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.networkid

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 に答える