3

私は MEAN アプリケーションを構築しています。私が抱えている問題の 1 つは、ユーザーが使用するルートを何らかの形で制御できるようにしたいということです。そのため、サーバー側のコード (expressJS) でクライアント側のコードにいくつかの変数を設定する必要があります。

基本的に、サーバー側のコードからクライアント側の JS を生成できるようにしたいと考えています。

たとえば、PHPでは、おそらく次のようなことをします

<?php
echo <script>
echo  var test = $test
echo </script>
 ?>

バインドについて話しているわけではありません。変数は、アプリケーションの初期ロード時にのみ設定する必要があります。

可能な限りクリーンな方法で、この種の MEAN との統合を達成するための最良の方法は何でしょうか...

4

3 に答える 3

4

ちょうど別のアプローチ

router.js
app.get('/myconfig', function(req, res){
    var config = {prop1:1,myarray:[1,2,3]};
    var json = JSON.stringify(config);
    res.end('var config='+json);
});
jade
script(type='text/javascript', src='/myconfig')

あなたができる角度よりも

angular.module('yourApp').constant('setup', config)
于 2014-01-28T11:00:38.630 に答える
3

オプション1

最初に、構成を返す API エンドポイントを作成します。

app.get('/conf', function(req, res) {
    res.send(200, {
        foo: "bar"
    });
});

次に、$http.getこのエンドポイントに対して a を実行し、angular で構成オブジェクトを取得し、app.runこの構成を service/ $rootScope/config に保存します。

app.run関数に角度的に最も近いものでありmain()、アプリケーションの起動時に一度実行されます。

オプション 2

うなり声を使用します。

ソリューションでサーバー側から変数を明示的に取得する必要がなく、アプリケーションのデプロイ時に変数がわかっている場合は、JavaScript コンパイルを実行し、grunt を使用して構成を挿入できます。

これは、私が個人的にこの状況に対処した方法です。

于 2014-01-28T08:53:02.590 に答える
1

私のアプローチは、クライアント側とサーバー側を完全に分離することです。

デモ プランカー: http://plnkr.co/edit/5cFLo3wLfbL0bUnifJe5?p=preview

サーバーはリソースのみに関係する必要があります。

app.get('/api/setup', function(req,res){

  var setup = // something

  res.json(setup);
})

クライアントは、データをフェッチした後にブートストラップを延期できます。

この回答に基づいて:手動ブートストラップの前に角度サービスを使用する

angular.bootstrap().invoke(function($http){ 

    $http.get('/api/setup').then(function(res){

        // providing the fetched data to the module:
        angular.module('yourApp').constant('setup', res.data)

        // manual bootstraping
        angular.bootstrap(document,['yourApp']);

    })
});

次に、モジュール内に挿入できsetupます。

app.config(function(setup){
  // constants can be injected to config blocks
})

app.controller('ctrl',function(setup){
   // do what you need
})

スプラッシュ スクリーンが必要な場合は、私の回答を確認してください: ng-cloak を使用してスプラッシュ スクリーンを作成する

于 2014-01-28T08:58:55.460 に答える