ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

Javascript-使用Ember.js和Handlebars,将模板绑定到类视图与视图实例之间有什么区别?

2019-10-31 21:35:16  阅读:151  来源: 互联网

标签:handlebars-js ember-js javascript


案例一:将模板绑定到视图实例.

例如,假设我有一个模板:

    <script type="text/x-handlebars" data-template-name="instance-template">
        <b> Name: </b> {{ name }}
    </script>

然后,我可以将视图实例绑定到该实例并附加到文档(为简单起见,在视图中声明参数名称,而不是绑定到某些控制层):

App.instanceView = Ember.View.create({
    templateName: 'instance-template',
    name: 'hello world'
}).append();

幕后到底发生了什么?通过指定模板名称,该视图实例是否以某种方式获取模板并使用在后台传递的参数进行编译?

情况二.将模板绑定到类视图,未命名模板.

但是,如果我想将模板绑定到类视图,例如:

App.ViewClass = Ember.View.extend({
    name: 'hello world',
});

该文档使用以下形式的模板:

<script type="text/x-handlebars">
    {{ #view App.ClassView }}
        This part renders: {{ name }} 
    {{ /view }}
</script>

请注意,当我这样做时,由于某种原因,这是行不通的.模板中的引号“ This part renders:”实际上是渲染的,但是{{name}}标签没有渲染.我不知道为什么.

情况三. template绑定到类视图,命名模板.

另外,如果我将上面的模板命名为:

<script type="text/x-handlebars" data-template-name = 'class-template'>
    {{ #view App.ClassView }}
        This part renders: {{ name }} 
    {{ /view }}
</script>

并将视图更改为

App.ViewClass = Ember.View.extend({
    templateName: 'class-template',
    name: 'hello world',
});

什么都没有呈现.同样,我看不到这里发生了什么.

解决方法:

情况1
是的.视图正在渲染(并且我们假设上下文是视图),那么当我们看到{{name}}时,这等效于instanceView.get(‘name’).

情况二
匿名模板不会更改上下文.在{{#view}}内定义模板时,上下文不会更改.要获取与{{#view}}助手一起使用的视图上下文,您需要使用view.name.例如:

App.ViewClass = Ember.View.extend({
    name: 'hello world',
});

<script type="text/x-handlebars">
    {{name}} <!-- lets pretend this is "something else" -->
    {{#view App.ClassView}}
        This part renders: {{name}} <!-- "something else" -->
        {{view.name}} <!-- "hello world" -->
    {{/view}}
</script>

情况3
这个例子没有意义,并且可能应该使用Ember(非最小版本)使声明失败.您正在定义一个使用模板的视图,然后在该模板内部使用匿名模板再次渲染该视图.如果这是您想要的含义,那么请您提供一个用例,因为您可能会尝试一种更简单的方法来完成.

标签:handlebars-js,ember-js,javascript
来源: https://codeday.me/bug/20191031/1978721.html

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有