angularJS {{variable}}无法显示在脚本标记中

时间:2017-01-16 09:34:59

标签: html angularjs show

<script type="text/template">
     <div class="abcd">
           <div class="efg" data-price="{{::displayPrice}}"></div>
     </div>
</script>

我有一个这样的模板,我需要将{{::displayPrice}}(范围内的变量)添加到div的数据价格部分。但是,div写在<script>标记中,导致其无效。

有人能告诉我怎么做吗?

2 个答案:

答案 0 :(得分:0)

您可以使用type="text/ng-template"将其转换为角度模板,这样angular将使用当前范围变量上的所有可用编译它:

<script type="text/ng-template" id"/my-template.html">
 <div class="abcd">
   <div class="efg" data-price="{{::displayPrice}}"></div>
 </div>

现在您可以将其用作路由器模板或ng-include="'my-template.html'"

如果您无法更改模板类型,则可以在控制器中编译模板的HTML(例如使用jQuery和$compile服务),例如:

var yourAngularTpl = jQuery('[type="text/template"]').eq(0).html();
yourAngularTpl = $complie(yourAngularTpl)($scope);

确保注入了$scope$complie并且您拥有jQuery(因为jQuery Light angular.element()是有限的)

答案 1 :(得分:0)

我们曾经使用的角度 在你的控制器(app.js)

$scope.price = "display some price";
你的HTML中的

<div>{{price}}</div>