3

meanjs はフロント エンド mvc に angularjs を使用し、SPA アプリケーションであるため、管理ダッシュボードがフロント エンド ページとは異なる場合、管理ダッシュボードを実装する最良の方法は何ですか? おそらく2つのアクセスポイント？

4

3 に答える 3

3

私もこれを達成する方法を探していましたが、検索結果をここに投稿しています。最初に新しいモジュールを作成します。

yo meanjs:angular-module admin
yo meanjs:angular-route adminHome
? Which module does this route belongs to? admin
? What do you want your route path to be? admin-home
? What do you want to call your view? admin-home
? What do you want to call your controller? AdminHome
   create public/modules/admin/config/admin.client.routes.js
   create public/modules/admin/controllers/admin-home.client.controller.js
   create public/modules/admin/tests/admin-home.client.controller.test.js
   create public/modules/admin/views/admin-home.client.view.html

最初のステップを実行したら、次に進むときに、生成されたビューを効果的にロードすることを確認します: http://localhost:3000/#!/admin-home 。次に、高速ルートとコントローラーを生成します。

yo meanjs:express-route admin
yo meanjs:express-controller admin

さあ、お楽しみです。アイデアは、ヒットしたときに異なるレイアウトビューのセットをロードするようにExpressに指示することです/admin

//Content of app/controllers/admin.server.controller.js
'use strict';

exports.index = function(req, res){
    res.render('admin-index', {
        user: req.user || null,
        request: req
    });
};

//Content of app/routes/admin.server.routes.js
'use strict';

module.exports = function(app) {
    var admin = require('../../app/controllers/admin.server.controller');
    app.route('/admin').get(admin.index);
};

コピーペースト：

app/views/index.server.view.html -> app/views/admin-index.server.view.html
app/views/layout.server.view.html ->app/views/admin-layout.server.view.html

編集app/views/admin-index.server.view.html：

{% extends 'admin-layout.server.view.html' %}

{% block content %}
    <section data-ui-view></section>
{% endblock %}

編集app/views/admin-layout.server.view.html：

[...]
{% for jsFile in jsFiles %}<script type="text/javascript" src="/{{jsFile}}"></script>{% endfor %}
[...]

前の「/」に注意してください{{jsFile}}

ファイナルタッチ。ブラウザーは代わりに /admin を読み込んでいるため、テンプレートへのパスが相対パスではなく絶対パスであることを ui-router に伝える必要があります。

//Content of public/modules/admin/config/admin.client.routes.js
'use strict';

//Setting up route
angular.module('admin').config(['$stateProvider',
    function($stateProvider) {
        // Admin state routing
        $stateProvider.
        state('admin-home', {
            url: '/admin-home',
            templateUrl: '/modules/admin/views/admin-home.client.view.html'
        });
    }
]);

templateUrl コンテンツの先頭にある「/」に注意してください

次の場所に移動して、管理ゾーンをテストします。http://localhost:3000/admin/#!/admin-home

于 2015-04-13T13:33:54.453 に答える
0

あなたの質問がはっきりしません。私が正しければ、おそらく通常の Web ページ (ダッシュボード) に SPA を接続することについて尋ねられます。そうであれば、AngularJS アプリケーションに別の論理パスを追加して、別の論理 URL からアプリケーションを開くことができます。たとえば ( ../dashboard/angularApp)

または、angularJS を使用してダッシュボードを実装する方法について尋ねる場合は、ここで確認できる誰かの作品を参照してください。

https://github.com/nickholub/angular-dashboard-app

于 2014-08-13T19:36:48.880 に答える