わかりました、最初に 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"} のオブジェクトの配列を返します。はい、サーバー側から選択を静的に設定できますが、一般的なケースでこれを機能させる方法を本当に知りたいです。