1

AngularJS アプリケーションを分割して整理して、5000 行の main.js ファイルだけにならないようにしようとしています。ディレクティブなどを分割して、make動作するコードをビルドするために使用しても問題ありません。ただし、私のコントローラーには、適度に複雑な内部クラスがいくつかあります。これらは、大まかに次のように定義されていました (わかりやすくするために 1 つだけを示しています)。

var app = angular.module("infrasense", []);
app.controller("AppMain", function($scope, $http, $timeout) {

    function NavTree(dbMain, dbTimeout, allTagTypes, allAttTypes) {
        ...
    }
    NavTree.prototype = {
        ...
    }

    ...
    $scope.navTree[0] = new NavTree(dbMain, dbTimeout);
    ...

});

NavTree クラス (データ ログ アプリケーションでサイトとアセットの階層ツリーを保持) は、ディレクティブを使用してレンダリングされ、内部で $http を使用してバックエンド サーバーと通信します (ツリーは複雑すぎて一度にメモリに保持できません。それは変わる）。

シンプルな (cat ベースの) ツールを使用して最終的なコードを生成し続けるために、NavTree をコントローラーから移動したいと考えています。私は現在、コントローラー内から $http を渡すことでこれを行っています。

function NavTree($http, dbMain, dbTimeout, allTagTypes, allAttTypes) {
    ...
    this.$http = $http;
    ...
}

app.controller("AppMain", function($scope, $http, $timeout) {
    ...
    $scope.navTree[0] = new NavTree($http, dbMain, dbTimeout);
    ...
});

これは機能しますが、洗練されておらず、AngularJS らしくありません。この種のことを行うための「適切な」方法を提案できる人はいますか?

4

1 に答える 1

0

成功！私は現在、これらの洗練されていない内部クラスを main.js から、それらが属するサービスに移動する方法のかなりの部分を占めています。

ドキュメントを読んだときに見逃していたが、「知っていたらよかったのに今知っていること — AngularJS のある生活」で再度述べられている重要な認識は、サービスが依存性注入で動作する単なるシングルトンであるということです。

私のサービスは次のように定義されています (「ポップアップ」は、エラー メッセージのポップアップ ウィンドウを管理する別のサービスです)。

app.factory("ThingTree", function (Popup, $q, $http) {

    // Database information. This is set up by the "init" function.
    // (There's only one DB, and this way I only have to pass its
    // connection info once.)
    var dbMain = "";
    var dbTimeout = 0;
    ...

    // Each level of the tree is an array of these tree objects.
    function TreeNode() {}
    TreeNode.prototype = {
        open: function() { ... }
        ...
    };

    return {

        // Initialise the database connection.
        init: function(myDbMain, myDbTimeout) {

            dbMain = myDbMain;
            dbTimeout = myDbTimeout;
            ...

        },

        // Create a tree and return the root node.
        create: function() { ... },

        ...

    }

});

正しい方向に進んでくれてありがとう！

于 2013-10-08T10:29:43.197 に答える