2016-07-27 10 views
1

私はAngularに問題があり、ドロップダウンから項目を選択し、Angularでモデルを更新しています。ドロップダウンで値で選択する正しい方法は何ですか?

私はStackOverflowを使って検索してきましたが、部分的な運がある場合にのみ検索しました。

問題は、モデルに値を手動で設定すると、ドロップダウンリストが正しく更新されますが、モデル自体は更新されません。 StackOverflowの上の様々な答えから

$scope.setSelected = function(){ 
    $scope.selected.id = 15; 
    //$scope.$apply();// $apply already in progress 
} 

、私は角度がこのアップデートについて知らないことがわかってきたと示唆した答えは$scope.$apply()$scope.$digest()のいずれかを実行することですが、両方$apply already in progress例外をスローします。私はこれが正しい方法ではないと感じています。意味がないので、値で選択するイベントを引き起こさなければなりません。

ドロップダウンメニューで特定の値を選択する正しい方法は何ですか?

「dinnermanを選択」ボタンをクリックすると完全なコード例では、https://jsfiddle.net/c2x3jvut/

で見つけることができ、ドロップダウン更新は修正が、示されたモデル、それが唯一の選択したモデルを示し、「ログ選択」が、クリック更新されたIDで

答えて

1

$ filterを使用すると、各プロパティの代わりにオブジェクト全体を取得できます。

$scope.setSelected = function(){ 
    $scope.selected = $filter('filter')($scope.persons,15,'id')[0]; 
    //$scope.selected.id = 15; 
    //$scope.$apply();// $apply already in progress 
    } 

Here is the modified version

+0

これは私が後だったものです - おかげでたくさん! AngularがIDだけを見ていることを確認するために、マイナーな調整を{id:15}に設定しなければなりませんでしたが、それ以外の方法では動作しませんでした。 –

1

ngのselectは、この例で誤って操作されているngModelに基づいて値をバインドします。効果を示すこと

$scope.setSelected = function() { 
    $scope.selected = $scope.persons[1]; // yes 
    // $scope.selected.id = 15; // no 
}; 

Fiddle might have been updated:正しい方法はngModelの参照ではなく、選択のIDを変更することです。

0

ない私はあなたがドロップダウンの各エントリに含めることがあなたの質問を理解して、まだ...

てください:

...ng-click="setSelected(<value>)"... 

と、もちろん、関数にパラメータを追加します。

ちなみに、フィーバーの例では、関数setSelectedでID 15を選択していますか?

0

現在のモデルをIDで更新するだけです。しかし、あなたが慎重に見ると、名前と年齢は変わりません。さらに、オブジェクト全体を以下のように更新する必要があります。

$scope.setSelected = function(){ 
    $scope.selected.id = 15; 
    $scope.selected.name = "Dinner-man"; 
    $scope.selected.age = 20; 
    } 

その他の方法でオブジェクトを直接更新できます。

関連する問題