web-dev-qa-db-ja.com

ng-initを使用してAngularコントローラでデータを初期化する

最近、私は私たちのプロジェクトの1つで以下に遭遇しました。 MVCビューの1つでは、モデルデータをngInitディレクティブを介してAngularコントローラーに渡します。

xxx.cshtml

<div ng-controller="AssessmentController"
     ng-init="Init('@Model.Status','@Model.ARN','@Model.AssessmentID','@Model.AssessorID',@Model.Contents, @Model.Date_of_Assessment.ToJsonTicks(),'@Model.HouseReferenceID',@Newtonsoft.Json.JsonConvert.SerializeObject(Model.House))">

Angular documentation によると、コントローラーの初期化にngInitディレクティブを使用しないことを指摘しました。

代わりに、私がngInitディレクティブでIDを送信することを提案しました:

<div ng-controller="AssessmentController"
     ng-init="Init('@Model.AssessmentID'">

その後、使用 $http service Angularコントローラーから残りのデータを取得します。

Angularコントローラ内でデータを取得するために別の呼び出しを行う必要がなく、ngInitディレクティブを介してすべてのデータを送信する方が速いと述べたので、開発者は私の考えを拒否しています。

このシナリオについてどう思いますか?私が今持っている唯一の点は、このコードは醜く、標準に従っていないということです。私が提案した道をたどるように開発者をどのように説得しますか?それとも私はここで完全に間違っていますか?

4
Kumudu

ショートバージョン:動的にビューを提供する理由Angular動的に表示するのはなぜですか?

問題の根源

例を見ると、Razorビューを使用してモデルのデータをビューに挿入しているようです。これは、Angularにデータを取り込むためのかなり逆効果の方法のようです。完全なルートは次のようなものです:

MVCコントローラー-> Razorビュー-> Angularコントローラー-> Angularビュー

これにより、さまざまなレイヤーを介してモデルを埋め込み、前後に変換します。

これがなぜ問題があるのか​​を理解するために、一歩戻りましょう。 Angular is 通常シングルページアプリケーション(SPA)フレームワークとして採用され、HTMLテンプレート自体を一度提供する(ng- *ディレクティブを含むバニラHTML)後の時点で、Angularは、このテンプレートをモデル(JavaScriptオブジェクト)と組み合わせて使用​​して、ビューをレンダリングし、データをモデルにバインドしたままにすることができます。これらのモデルは通常サーバーからJSONオブジェクトとして直接取得されます。

したがって、典型的な使用法ではサーバー側のテンプレートはほとんど必要なく、ほとんどのデータ通信はWeb APIなどへのXHR/JSONリクエストを介して行われます。このように、JSONへの変換は、MVC(または選択したJSONライブラリ)によって行われる単純な(自動)変換であり、各レイヤーで繰り返す必要はありません。モデルオブジェクトはJSONとして提供されるだけであり、Angularに追加されました。

効率性-このアプローチを受け入れる場合、ビューテンプレートを最初にロードするリクエストが1つあり、その後、オブジェクトをロードしてテンプレートをレンダリングするたびに1つのリクエストがあります。追加のボーナスとして、後続の呼び出しはデータを取得するだけで、毎回データ+ビューではありません。

勧告

要約すると、あなたが説明している使用法はすでに比較的標準的ではないと思います。もちろん、そのようにAngularを使用することを妨げるものは何もありませんが、それは逆効果であり、どちらのアプローチがより優れているかについて話すのが難しくなります。 Angularのアプローチを完全に採用するのではなく、反対に取り組むのです。

4
Daniel B