1

フォームを作成して、angularjs（これは素晴らしいです）をいじっています。json からデータを読み込み、データを正常に読み取ることができますが、作成したプランカーに関していくつか質問があります。( http://plnkr.co/edit/LHX40xHKmoB9onboeNrV?p=preview )

そこには 2 つのフォームがあり、どちらも半分は機能しています。続行する前に、angularjs のプロへのリクエストがあります。どうすれば改善できますか？ありがとう。

とにかく、次のスニペットは 2 つの形式の違いです。

FORM#1:フォームを機能させるために、jsoncountryから値を取得する ' ' を指定countries

JS :

$scope.vm.country = data[0].countries[0];

HTML:

Country: <select ng-model="vm.country" ng-options="c.name for c in vm.countries"></select>

FORM#2: この JSON は #2 とは少し異なります。countries配列は と呼ばれますcountry。選択オプション expr がそれ自体を参照しています - 失敗しています。ここで提出されたjsonon-clickには、私が求めている国コード/名前の正しい値がありますが、cities配列も含まれていますが、これは私が望んでいるものではありません。

JS :

$scope.vm.country = data[0].country[0];

HTML:

Country: <select ng-model="vm.country" ng-options="c.name for c in vm.country"></select>

選択ボックスが form2 のように動作している理由を正確に知りたいです。フォームの送信に関しては、無駄なデータを送信することは明らかに望ましくありません。では、必要なものだけを に送信するにはどうすればよい$scope.vmでしょうか。小さなフォームの場合、各入力を新しい $scope 項目に手動で追加することは問題なく機能しますが、多くの入力を含む巨大なフォームの場合は理想的ではありません。

アップデート

別の変数 ( ) に適切な値が入れられた実用的なソリューションを次に示します$scope.form。また、$watchに変更されましたng-change。これは他の人を助けるかもしれません。

http://plnkr.co/edit/NDSvKS0mEF1Wgp2CBIOB?p=preview

4

1 に答える 1

3

微妙なバグです。json ファイルを見ると、国の「リスト」の名前が国であることがわかります。それを countries に変更します。失敗する理由は、コントローラーで vm.country を設定するときにリスト全体をオーバーライドするためです。簡単な修正を示すために、プランカーをフォーク/更新しました。

フォーム データに関する限り、フォーム要素で選択をラップし、その方法で値を取得することをお勧めします。この問題については、 Angularjs のページをご覧ください。

全体的に、私のプランカー コード スタイルは適切な angularjs の方法ですか? どうすれば改善できますか？ありがとう。

コントローラーが少ないだけなので、悪くはありません。angularを使用して見つけたいくつかの役立つこと：

1) このような場合、html のデバッグは煩わしい場合があります。幸いなことに、angular の「angular.element」メソッドは、要素のスコープを検査する機能と同様に html を返します。それがどのように機能するかについては、このデバッグ チュートリアルをご覧ください。firebug または chrome 開発ツールを使用しているかどうかに関係なく、同じ概念が適用されます。

2) 可能な限り $watch メソッドを回避する方法を考えてください。その理由は、更新が呼び出されたスコープに直接関連していない場合でも、アプリで更新が発生するたびにこのメソッドが呼び出されるためです。提案として、フレームワーク内の $digest ごとに $watch を起動させるのではなく、実際の dom 要素が変更されたときにのみ起動する ng-change ディレクティブを select ステートメントに追加することをお勧めします。

お役に立てれば。

于 2013-04-24T04:47:43.247 に答える