如何使用JavaScript类型的网页内= QUOT;文/ NG模板"? [英] How to use javascript inside a page with type="text/ng-template"?

查看:91
本文介绍了如何使用JavaScript类型的网页内= QUOT;文/ NG模板"?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有code是这样的:

I have code like this:

<script id="templates/orderdetails.html" type="text/ng-template">

    <ion-view view-title="OrderDetails">

        <ion-content class="padding">

            <p>Here I want to display order details...</p>

            {{ detail }}

<script type="text/javascript">
            var obj = JSON.parse( {{ detail }} );

            document.write('<table>');
            document.write('<thead>');
            document.write('<tr>');
            document.write('<th>菜名</th><th>单价</th><th>份数</th><th>小计</th>');
            document.write('</tr>');
            document.write('</thead>');
            document.write('<tbody>');

            document.write('</tbody>');
            document.write('</table>');

            for(id in obj) {
                document.write(obj[id]["name"]);
                document.write(" ");
                document.write(obj[id]["price"]);
                document.write(" ");
                document.write(obj[id]["num"]);
                document.write(" ");
                document.write(obj[id]["total"]);
                document.write("<br>");
            }
</script>
            <p>
                <a class="button icon ion-home" href="#/tab/home"> Home</a>
            </p>

</ion-content>
</ion-view>

</script>

我想{{详细}}被解析并显示如下所示:
这里输入链接的描述

但我发现JavaScript的不是内部组件&LT;脚本ID =模板/ orderdetails.html类型=文/ NG-模板&GT; ,如何我能做到这一点?谢谢你。

But I found javascript not working inside "<script id="templates/orderdetails.html" type="text/ng-template">", How can I do that? Thanks.

推荐答案

您可以更好地添加以下表的HTML模板是这样的:

You can better add the following table-html to your template like this:

<table>
  <thead>
    <tr>
      <th>菜名</th><th>单价</th><th>份数</th><th>小计</th>
    </tr>
  </thead>
  <tbody>
    <tr ng-repeat="id in obj">
       <td>{{name}}</td>
       <td>{{price}}</td>
       <td>{{num}}</td>
       <td>{{total}}</td>
    </tr>
  </tbody>
</table>

伍重复会使你的obj变量为每个项目的necesarry表行。这之后,您需要在您的控制器来定义 $ scope.obj 因为你的角度应用将寻找。我认为这只是definig VAR OBJ 不工作,但我从来没有使用过这种方式。

Ng-Repeat will render the necesarry table rows for every item in your obj variable. After that you will need to define $scope.obj in your controller since your angular app will look for that. I think that just definig var obj is not working, but I have never used it that way.

这篇关于如何使用JavaScript类型的网页内= QUOT;文/ NG模板&QUOT;?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
相关文章
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆