2017-12-15 8 views
6

私は、ASP.NET Core MVCを搭載したサーバーを持つWebアプリケーションで作業しています。フロントエンドは、TypeScriptを使用するAngular 5.0 Single Page Applicationです。Web APIを使用するクライアント側のWebアプリケーション、サーバー側のWeb APIの期待に基づいてセレクトボックスのフィールド値を設定する方法は?

クライアントでは、私はフォームと<select>入力コントロールのあるページを持っています。私の設計上の課題は、<select>の選択肢を、.NET CoreのWeb APIが期待する値に限定する必要があるということです。

サーバーとクライアントアプリケーションが同じVisual Studioソリューションの一部であるため、私はWeb APIの変更の中断を最小限に抑えようとしました。私はこれを行うことができるかもしれないと思った1つの方法は、クライアント側のフォームと入力を多少ダムにして、<select>コントロールを設定するために有効な値をサーバーに要求することです。このようにして、クライアントとサーバーでロジックを複製する必要はありません(たとえば、C#でEnumを定義し、TypeScriptで再び定義した場合)。しかし、私は思うことがあります(<select>の値に基づいて他のフォームフィールドの表示を切り替えたい場合は、値を前提とするロジックをハードコードする必要があります)

これは私が得た私が使用することができ

+1

、私はちょうど前後1を入れて、あなたが方が好きかを評価しましょうよ。 t4テンプレートを使用して、typescript、C#、またはその両方を生成することができます。 – Taekahn

答えて

2

ひとつのアイデアのようなものを行うことです他のソリューションはどのような良いアイデアです:?

  1. のWeb APIを呼び出して、可能なを取得するために角度サービスを使用します? の選択肢(リストになるので)
  2. ビンあなたの可能な選択リストは<select>になります。

Angular ServiceをHTTPリクエストを作成してレスポンスするのはかなり簡単ですが、コンポーネント内の変数に可能な選択肢を入れて、その変数を消費します。

+0

はい、それは私が想像していたものより多かれ少なかれです。あなたは "AngularJS"ソリューションにリンクしましたが、私はv2 +であり効果的に全く異なるフレームワークである "Angular"を使用しています。私は多くの実装の詳細ではありませんが、この質問で戦略のアイデアを得ようとしています。 –

+0

ああ、私の悪い。私はそれを削除した。 – Haytam

0

私が正しくあなたの問題を理解している場合、あなたのフォームフィールドは、として動的にあなたは国が国に基づいて移入されるにしたい3つのフォームフィールド 1.Country 2.State 3.City をpopulated.Supposeたいです。 それでは、上記の解決方法を試してみてください。 そしてあなたの周りのフィールドで再生したい場合、Web APIはあなたに応答を与えることに注意してください。MVCビューはモデルに依存しますが、ここではこれはケースです。この状況に対処するには、値に基づいて、またはフォームフィールドで再生する情報を含む余分な属性を持つWeb API応答モデルを選択します。

現在、私は、私はあなたが提案したソリューションは、サーバーからoptionsを要求し、あなたのselectでそれらを移入するための最良のそれまでのソリューションです推測TS MVC +ウェブAPI

0

でプロジェクトangaulr 4の同じ種類に取り組んでいます。しかし、私は、あなたが論理についてのハードコーディングと値に関する仮定についてもう一つの点を理解していません。まず、Enumを作成する場合は、すでに一連の値があり、これを想定しています。

+0

ハードコーディングの例に関して、最悪のシナリオでは、私の角度表示では、別の '