2016-05-24 20 views
0
小枝テンプレートに&角度JSを使用して

問題角度jsの変数は、小枝

  • イムで作業されていません。小枝はSYMする変数(メッセージを処理されるよう

コントローラ

public function testAction() 
{ 
    $this->render('AcmeDemoBundle:abc.html.twig'); 
} 

JSコード

var scotchApp = angular.module('scotchApp', ['ngRoute']); 

angular.module('scotchApp', []) 
.config(['$interpolateProvider', function ($interpolateProvider) { 
    $interpolateProvider.startSymbol('[['); 
$interpolateProvider.endSymbol(']]'); 
}]); 

scotchApp.config(function($routeProvider) 
{ 
    $routeProvider 
    //route for home page 
      .when('/', { 
       templateUrl:'http://localhost/example/example/web/app_dev.php/home', 
       controller:'mainController' 

     }) 
     //route for the about page 
       .when('/about',{ 
       templateUrl:'http://localhost/example/example/web/app_dev.php/about1', 
       controller:'aboutController' 

     }) 
     //route for the contact page 
       .when('/contact',{ 
       templateUrl:'http://localhost/example/example/web/app_dev.php/contact', 
       controller:'contactController' 

     }); 
}); 
// create the controller and inject Angular's $scope 
scotchApp.controller('mainController', function($scope) { 

    // create a message to display in our view 
    $scope.message = 'Everyone come and see how good I look!'; 
}); 

HTMLコード

<div class="jumbotron text-center" ng-model="test"> 
    <h1>About Page</h1> 

    <p>{{ '{{'~ message ~'}}' }}</p> 
</div> 
  • そのらしいですテストコントローラーを通じてレンダリングされたフォニー

  • 私たちはテストコントローラーを通じてtwigにメッセージ変数を表示していませんでした。その構文をseperating(小枝を通じて

    ことが可能になることができますが

を働いていないかのよう
  • は、私はこの問題は、小枝は角jsの変数

  • ので、私はGoogleで検索している有効に変更と競合されている知っていたが、 /角度JS)

    link : https://docs.angularjs.org/api/ng/provider/$interpolateProvider 
    

    更新

    {% verbatim %} 
        <div ng-app="scotchApp" ng-controller="aboutController"> 
        {{message}} 
    </div> 
    
        {% endverbatim %} 
    
    • {{message}}はブラウザに印刷されていますが、この場合角が動作しません。

    私はsymfonyで混合することができる

    i need to render message variable to twig file through angular js 
    
  • +1

    あなたがすることはできません。 Twigはバックエンド、angularjsはフロントエンドです。バックエンドは常にサーバーによって最初に実行されます。次に、クライアント上のフロントエンドでデータを処理できます。 – RaV

    +0

    http://stackoverflow.com/questions/13671701/angularjs-twig-conflict-with-double-curly-braces - これを確認してください。また、生成しているページのコードを表示するだけでテストできます。常に調査要素を使用しないでください。ビューページのソースを使用する。 – RaV

    +0

    {%verbatim%} twigエンジンを使用しているときにangular jsが機能していない – afeef

    答えて

    0

    アンギュラ必要はなく、常に良いアイデアが何でありますか。あなたの例で は与えるyuo

    $interpolateProvider.startSymbol('[['); 
    $interpolateProvider.endSymbol(']]'); 
    

    小枝の角度のためにあなたが使用する必要があることを意味することに[[変数]]の代わりに、{{変数}}