2016-11-21 8 views
2

私のやっていることは、自分のサーバーからテンプレートを要求することです。これの短い例は、次のようになります。AngularJS:文字列に角度変数を含むスコープ変数からHTMLをレンダリングする

これはサーバーから受信しているJSONオブジェクトです。これをDOMにレンダリングしたいと思います。表示されるのは、$scope.nameの店舗だけです。

私は私の角度

app.filter("trust", ['$sce', function($sce) { 
    return function(htmlCode){ 
    return $sce.trustAsHtml(htmlCode); 
    }; 
}]); 

でこれを持っており、これは私のHTMLに

<div ng-bind-html="template.html | trust"></div> 

これはHTMLをレンダリングしますが、葉{{名前}}のように{{名前}}、ときにそれをジョンと言うべきです。

+0

https://plnkr.co/edit/5XwTMRTK83KntRP5LE8I?p=preview – nmanikiran

+0

を追加しました。詳しくはhttps://docs.angularjs.org/api/ng/service/$compile – nmanikiran

+1

@ManiKiranをご覧くださいあなたの解決策 – notacodemonkey

答えて

0

あなたがこのような単一引用符で名前を入れて$のscope.dataに忘れてしまったようだ:

$scope.data = { 
    'name' = 'John' 
} 

希望これはバックエンドで(角度変数で)HTMLを保存

+2

以下に述べるように、それは実際のコードではなく質問を簡略化してくれます。私は質問を更新しました。 – notacodemonkey

3

を働く悪い習慣です。 あなたの優先順位は、バックエンドコードをリファクタリングすることです。

あなたはバックエンドへのアクセス権を持っていない場合は、コンパイル$を使用してディレクティブを作成しようとすることができます:

$scope.template = $interpolate('<html><head><style>body {background: red;}</style></head><body>{{data.name}}')($scope); 

$scope.template = $compile('<html><head><style>body {background: red;}</style></head><body>{{data.name}}')($scope); 

あなたは$interpolateを使用して、そのコントローラでも行うことができます

+0

私はノードにもバックエンドを構築しています。バックエンドコードのリファクタリングをどのように提案しますか?このために、私はテンプレートを素早く切り替えようとしていました。あなたは翡翠のようなものを使用しますか? – notacodemonkey

+0

バックエンドはデータのみを返すべきです。書式設定は、anglejsテンプレートを使用してクライアント側で行われます。 – gyc

+0

私はバックエンドに自分のテンプレートを保存したいのですが、それはユーザーに応じて動的に表示する必要があるからです。これらのテンプレートはすべて同じデータを表示しますが、異なるフォーマットで表示されます。 – notacodemonkey

関連する問題