Angular JS - ダッシュボードのベストプラクティス

私はAngular JSの新機能を搭載しており、より大きなDjangoアプリケーション内でAngular JSの動いているダッシュボードを作成しています。私はAngularで多くのことを読んだことがありますが、内部に多くの独立したウィジェットを持つAngularアプリケーションを構築する最良の方法は何かについてはまだ疑問があります。Angular JS - ダッシュボードのベストプラクティス

私は、1つのHTMLドキュメントにつき1つのアプリケーションしか存在しないと理解していますが、通常はページの1ngビューコールがあります。私の質問は、自分のアプリとして個々のウィジェットを設定するか、 1つのアプリケーション内で複数のモジュールを制御できますか？私の文書の先頭で宣言

現在、私がしているNG-アプリ

<html lang="en" ng-app="dashboard">

私は一度だけNG-ビューを使用できるかどうか、私は残りのウィジェットをレンダリングする方法をわかりませんか？

私はこの質問がかなり主観的で、おそらく完全な答えはなく、ちょうどいくつかのベストプラクティスまたは機能的アドバイスを探していることを知っています。

ありがとうございます！

出典

2014-01-21 xXPhenom22Xx

「ng-include」を使用すると、ページに複数のウィジェットを配置できます。 – Phill

'angular.module（ 'moduleName'、[]）'を使って複数のモジュールを作ることができます。一つのアプリケーションと複数のモジュールを持つことができます。依存関係注入を使用して、異なるモジュール間で通信する..もっと読むhttp://docs.angularjs.org/guide/di – JABD

AngularJSの新しい人物がこの道を少し通り抜けたので、私は[ui-router] （https://github.com/angular-ui/ui-router）より早く。 –

かなり主観的ですが、複数のコントローラやディレクティブを使用すると、正常に実行されると、探している効果が得られます。例えば

、

<html ng-app="my-dashboard"> 
    <body> 
    <div class="Some structuring thing"> 
     <ng-include src="my-header.html"></ng-include> 
    </div> 
    <div class="Some other thing"> 
     <ng-include src="my-sidebar.html"></ng-include> 
    </div> 

    etc... 

    </body> 
</html>

次に、各セクションは独自の、スタンドアロンコンポーネントとすることができます。そこから、あなたはコントローラに分解することができます...

<div ng-controller="my-header-text"> 
    <p ng-bind="title"> 

    etc... 
</div> 
<div ng-controller="my-header-login"> 
    <p ng-click="login()">Login</p> 

    etc... 

</div>

また、さらに指示に。

<my-custom-directive words="user.name"></my-custom-directive>

この例は実際には過剰ですが、そのポイントは残ります。必要に応じて粒度を制御する方法はたくさんあります。

個人的に、これらは私が従ってほしいルールです。

一つの文書につきapp（規定として、また、それが理にかなっているため。）
だけで立つことができるすべてのDOMのサブツリーのための新しいコントローラ。私のログインとダッシュボードは明らかに異なる目的を持っています。細かいことが必要な場合は、それぞれのコントローラを自分のコントローラに分割し、servicesを使用してアプリケーションのルートとの通信を適切に処理します。私はダッシュボードだけでなく、どのページにもログインすることができました。ユーザーはログインとログアウトのオプションがなくてもダッシュボードを使うことができました（ログインしていないユーザーのデフォルトの場合を想定しています）。自分のコントローラーの候補者。
私は、自明ではないHTMLチャンクのカスタムディレクティブが好きです。読みやすさと再利用に役立ちます。ちょうど常にisolateスコープを使用してみてください。できない場合は、実際に指示があるかどうか質問してください。あなたのアプリケーションだけでなく、それを含み、正しいAPIに従っている同様のアプリでも使用できると仮定して、あなたの指示文を書いてください。

出典

2014-01-21 03:56:40 Hylianpuffball

これは完璧です、私は実行可能なオプションだった確認を得るために喜んで、複数のコントローラのルートをダウンし始めた。詳細な回答を書く時間をとってくれてありがとう。 – xXPhenom22Xx