Angularjs表記仕様

2610 ワード

ファイル名の原則:

  • は、コンポーネント機能を記述し、次いでタイプ(オプション)に従って、すべてのコンポーネントに統一されたネーミングを提供する.
  • 命名:feature.type.js.
  • テストファイル名(feature.type.spec.js)
  • ほとんどのファイルには2つの名前があります.
  • ファイル名(avengers.controller.js)
  • Angular付き登録コンポーネント名(AvengersController)
  • テストファイル名(avengers.controller.spec.js)

  • ルール#ルール#

  • ファイルは、1つのコンポーネント
  • のみを定義します.
  • 各ファイルはJavaScript閉パッケージ
  • を使用する必要があります.
  • moduleを使用する場合は、直接変数を使用するのではなく、getterのチェーン構文を使用します.
  • module,angular.module('app', []);を設定します.
  • module,angular.module('app');を取得する.

  • コールバック関数名前付き関数を使用し、匿名関数
    // logger.js
    angular
        .module('app')
        .factory('logger', logger);
    
    function logger () { }
  • を使用しないでください.
  • controllerでは、まず$scopeをキャプチャ可能な変数にコピーし、vmがViewModel(controller as構文糖間の切り替えを容易にする)
    function Customer ($scope) {
        var vm = $scope;
        vm.name = {};
        vm.sendMessage = function() { };
    }
  • を表す代表的な名前を選択する必要がある.
  • バインド可能なメンバーを最上位に配置します(注:関数が1行である場合は、読み取りに影響しない限り最上位に配置します).
    function Sessions() {
        var vm = this;
    
        vm.gotoSession = gotoSession;
        vm.refresh = refresh;
        vm.search = search;
        vm.sessions = [];
        vm.title = 'Sessions';
    
        ////////////
    
        function gotoSession() {
          /* */
        }
    
        function refresh() {
          /* */
        }
    
        function search() {
          /* */
        }
    }
  • Controllerの独自性を維持し、1つのviewは1つのcontrollerを定義し、できるだけ他のviewでこのcontrollerを使用しないでください.再利用可能な論理をfactoryに配置し、controllerが現在のビュー
  • にのみサービスすることを保証する.
  • 独立データコール(Data Services):
  • データ操作とデータ相互作用を行うロジックをfactoryに配置し、データサービスはXHR要求、ローカルストレージ、メモリストレージ、その他の任意のデータ操作
  • を担当する.
  • データサービスが呼び出された場合(例えばcontroller)、呼び出された直接的な動作を隠す
  • .
  • データ呼び出しPromise
  • を返す
  • Directives
  • dirctiveファイル
  • は一意のDirective接頭辞を提供し、フォーマット:{namespace}-命令名
  • 圧縮処理(圧縮によるエラー防止):
  • 手動追加依存
    angular
        .module('app')
        .controller('Dashboard', Dashboard);
    
    Dashboard.$inject = ['$location', '$routeParams', 'common', 'dataservice'];
    
    function Dashboard($location, $routeParams, common, dataservice) {
    }
  • Controller命名:UpperCamelCase(単語ごとに頭文字が大文字)を使用する方法;接尾辞はControllerを使用します.例:AvengersController
  • Serviceネーミング:サービスとfactoryに対してcamel-casing(アルパカ式、最初の単語の頭文字が小文字で、後ろの単語の頭文字が大文字)方式を使用します.$接頭辞の使用を避ける.
  • Directiveコンポーネントの名前付け:camel-case方式を使用して、directiveがどの領域で使用されるか(一部の例では会社の接頭辞またはプロジェクトの接頭辞を使用する)
  • を短い接頭辞で記述します.