symfony - symfony2アプリケーションのAngularjs

Question

私はフロントエンドで多くのJavaScriptを使用するSF2アプリケーションに取り組んでいます。

SF2は、優れたRESTアプリを構築したり、データベースを教義で管理したり、テンプレートに小枝を使用したりするための優れた方法を提供してくれますが、Angularjsを使用したいと思います。

私はangularjsとSF2が異なるアプローチを持つ2つの異なるフレームワークであることを知っていますが、この作業を行うための最良の方法は何であるか疑問に思っています。

それも価値がありますか？

はいの場合、よりクリーンで最も効率的なソリューションは何だと思いますか？

たぶん、angularjs中括弧を使用するために、テンプレートに小枝の代わりにphpを使用しますか？

score 64 · Accepted Answer

私Symfony2は完璧にうまくいくと思いますAngularJS。その証拠に、片側で Symfony を使用して API を作成し、反対側で AngularJS を使用して Web アプリを作成しています。

さらに、いくつかの理由で、Web アプリでビューを生成しTwigます。{% verbatim %} {% endverbatim %}ビューでAngularを使用する必要があるたびに、Angularの中括弧を小枝ステートメントに埋め込むだけです。

score 17 · Accepted Answer

私は同じ状況に直面しています。私の場合、クライアントプロジェクトとサーバープロジェクトを分割することにしました。サーバー側として symfony2 を使用しました。これは、私にもたらされる他の利点に加えて、シンプルさと使いやすさであるためです。一方、同じクライアントファイルを使用して HTML5 モバイルアプリを作成したいので、AngularJS を使用して単純な HTML プロジェクトを作成しました。

その場合、ここでの問題の核心は認証と承認のプロセスにあると思います。サーバー側で REST で作業するための安全なファイアウォールを実装する必要があります (例: WSSE: Symfony2: カスタム認証プロバイダーの作成方法)。

そして、クライアント側 (AngularJS) の対応する実装、私が見つけた最も有用なリソース: Github:witoldsz/angular-http-auth。

sf2 プロジェクトでより深い実装が必要な場合は、Assetic のフィルターを使用して AngularJS をコンパイルし、ページの読み込みのパフォーマンスを向上させることができます。

score 13 · Accepted Answer

次のコードを使用してAngularJS区切り文字を変更しました

コーヒースクリプト:

# Change the angular delimiters for twig compatability
# and load module with ngResource
WAFapp2 = angular.module("WAFapp2", ['ngResource'], ($interpolateProvider) ->
  $interpolateProvider.startSymbol "{[{"
  $interpolateProvider.endSymbol "}]}"
)    var WAFapp2;

または Javascript:

var WAFapp2;

WAFapp2 = angular.module("WAFapp2", ['ngResource'], function($interpolateProvider) {
  $interpolateProvider.startSymbol("{[{");
  return $interpolateProvider.endSymbol("}]}");
});

次に、レイアウトの上部に:

<!DOCTYPE html>
<html lang="en" data-ng-app="WAFapp2">
  <head>

その後、html の body タグセクションで使用できます。

<ul>
{% for item in seq %}
    <li>{[{ item }]}</li>
{% endfor %}
</ul>

これにより、物事がきれいに保たれ、小枝と角度のあるタグを簡単に混在させることができると思います。これは私にとってはうまくいくようです。

score 11 · Accepted Answer

angular アプリを分離しておくことをお勧めします。Symfony をデータの取得/永続化のための API として、またセキュリティプロバイダーとして使用するだけです。

これにより、ビューとデータレイヤーをさらに分離できます。その結果、バックエンドの実装についてまだ考えなくても、フロントエンド側で作業を開始できます。API呼び出しをモックするだけです。

score 3 · Accepted Answer

このテンプレートを使用することも、このテンプレートを学習してそれに基づいて作成することもできます。

AngularJS を使用したクライアント部分と Symfony2 を使用したサーバー部分の間で、RestFul API を介した安全な通信を行うテンプレートアプリケーションです。

チェックすべきもう 1 つのプロジェクトは、Aisel が Symfony2 と AngularJS に基づく高負荷プロジェクト用のオープンソース CMS であることです。

score 0 · Accepted Answer

Web を検索すると、さまざまな解決策が見つかりました。たとえば、前述のように、角度記号を変更できます。ただし、小枝に角度記号を出力するように指示するだけで、できるだけシンプルに保つことを好みました。

{{ '{{entity.property}}' }}

http://louisracicot.com/blog/angularjs-and-symfony2/

score 0 · Accepted Answer

{@ variable @}テンプレートで使用します。テンプレートが生成された後、{@とを単純な関数に置き換えるだけです。この方法はクリーンで、文字列の連結などよりもはるかに高速です。{{@}}}str_replace

score -2 · Accepted Answer

次のような中括弧を簡単にエスケープできます。

Hello {{ '{{' }} name {{ '}}' }}

次の HTML コードに解析されます。

Hello {{ name }}

また、左中括弧と右中括弧の HTML コード化文字セットを使用することもできます。次に例を示します。

&#123; name &#125;

しかし、それがAngularJS libによって理解されるかどうかはわかりません:)。

symfony - symfony2アプリケーションのAngularjs

15 に答える 15

Related

Reference