0

mysqlk の通常のリレーショナル データベースからデータを取得する API にプラグインされた Angularjs を使用しています。

私のbddにこの単純なデータモデルがあるとしましょう：

table car:
  id,
  type_id

table type:
  id,
  label

DBからデータを取得して、車のリストとdbからの静的ラベルを取得するAPIがあります。

http://myapi/car/
response :
   {[{id:1, type_id:2}, {id:2, type_id:3}]}

http://myapi/carstaticlabel/
response :
   {[{id:1, label:convertible}, {id:2, label:limousine}, {id:3, label:pickup}]}

私の目的は、最初にタイプ ラベル付きの車のリストを表示し、次にダイアログを開いて、選択した車のプリロードされた値を含むフォームを表示できるようにすることです。

レンダリングされた車のリスト:

1 convertible
2 pickup

ID が 1 の編集された車のレンダリングされたフォーム: 車のタイプを選択します。

<select>
  <option value="1">convertible</option>
  <option value="2" selected="selected">limousine</option>
  <option value="3">pickup</option>
</select>

私はさまざまなアプローチを試しましたが、どれもエレガントではありません

解決策 1

車のリストについては、API を変更し、car と type を直接結合して、ラベル付きのリストを取得します。

http://myapi/car/
response :
   {[{id:1, type_id:2, type:{[id:2, label:limousine]}}, {id:2, type_id:3, type:{[id:3, label:pickup]}}]}

次に、 car.id および car['type']['label'] の形式で割り当てるだけです。

問題: 各車には繰り返し情報 (ラベル) が含まれます >> 肥大化した情報

編集フォームの場合: 選択した車の json をフォームに渡し、デフォルト値を設定します。

<p>type: <select ng-model="car.type"  ng-options="type.label for type in type_list" required></select></p>

それに関する私の問題：

フォームを送信するとき、type_id を直接取得するのではなく、代わりに car.type オブジェクトを取得するので、データベースに投稿するには、それを id に変換する必要があります。変換するには、car.type オブジェクトに移動し、内部のオブジェクトを取得してから、その ID を取得する必要があります...非常に洗練されていません。

解決策 2

配列を操作して、角度の内側で「結合」を行います。

問題: 後でフォームのデフォルト値を設定するのが非常に難しい

私は迷っています。その単純なタスクを達成するための通常のベストプラクティスは何ですか?

4

1 に答える 1

1

select as label for value in array配列データ ソースの構文を使用する必要があります。あなたの例には、オブジェクトの配列である複雑なデータ構造があります。したがって、次のようなものが必要です。

<select ng-model="selectedId"
        ng-options="x.id as x.label for x in response">
</select>

提案されたソリューションを示すために、ここで小さな例を作成しました。

于 2014-01-08T08:14:01.790 に答える