Question

看看这个JS：

App = Ember.Application.create();

App.AView = Ember.View.extend({
    tagName: 'span',
    firstName: 'Joe',
    surname: 'Bloggs'
});

和这个HTML：

<script type="text/x-handlebars">
    {{#view App.AView}}{{firstName}}{{/view}}
</script>
<script type="text/x-handlebars">
    {{#view App.AView}}{{surname}}{{/view}}
</script>

渲染时（如本jsfiddle所示：http://jsfiddle.net/r9svv/3/）显示：

Joe
Bloggs

我希望它们出现在同一条线上，即'<script text="text/x-handlebars">'正在成为一个余烬视图，我需要将它设置为'span'而不是'div'。我该怎么做？

由于

Answer 1

您可以在data-tag-name代码上指定<script>：

<script type="text/x-handlebars" data-tag-name="span">
    {{#view App.AView}}{{firstName}}{{/view}}
</script>
<script type="text/x-handlebars" data-tag-name="span">
    {{#view App.AView}}{{surname}}{{/view}}
</script>

Answer 2

是吗：

<script type="text/x-handlebars">
    {{#view App.AView}}{{firstName}} {{surname}}{{/view}}
</script>

你正在寻找？

Answer 3

这告诉ember使用嵌套的内部AView创建一个外部匿名视图。

<script type="text/x-handlebars">
    {{#view App.AView}}{{firstName}}{{/view}}
</script>

编辑：您可以更改此类匿名视图的标记名称。见下文。

为了实现所需的行为，我将通过使用命名视图模板来避免外部匿名。我创建了两个使用相同模型的视图。这是一个例子。

http://jsfiddle.net/algesten/v8WD2/2/

App = Ember.Application.create();

App.model = Ember.Object.create({ // move data to model object
    firstName: 'Joe',
    surname: 'Bloggs'
});

App.AView = Ember.View.extend({ // make two named views
    tagName: 'span',
    templateName: 'first',
    model: App.model
});
App.BView = Ember.View.extend({
    tagName: 'span',
    templateName: 'last',
    model: App.model
});

// append the views
$(function() {
    App.AView.create().append();
    App.BView.create().append();
});

车把：

<script type="text/x-handlebars" data-template-name="first">
    {{model.firstName}}
</script>
<script type="text/x-handlebars" data-template-name="last">
    {{model.surname}}
</script>

编辑：正如ebryn所指出的那样。可以在匿名视图上更改标记名称。

<script type="text/x-handlebars" data-tag-name="span">
    {{#view App.AView}}{{firstName}}{{/view}}
</script>
<script type="text/x-handlebars" data-tag-name="span">
    {{#view App.AView}}{{surname}}{{/view}}
</script>

3 个答案: