2

我对 F3 很满意，但对主干.js 来说完全是新手。我正在尝试在获取请求中侦听一些参数，然后通过主干模板在主干视图中使用它们，并以“正确”的方式进行操作......

到目前为止，这是我正在做的事情的简化版本：

请求的网址：

http://myserver.com/route/?foo=12345

这是我的 F3 路由处理代码：

F3::route('GET /route', 'start');
function start() {
    F3::set('foo', pg_escape_string($_REQUEST["foo"]) );
    echo Template::serve('page.html');
}

我设置了fooF3 变量，以便可以在 page.html 模板中使用它。以下是 page.html 的内容：

<script>
var foo = '{{@foo}}';
</script>

所以现在我将 foo 参数作为 javascript 中的全局变量，我想将它放入主干视图，其内容由主干模板填充。

这是主干视图中的内容：

var fooView = Backbone.View.extend({
    el: '#foo-container',
    template: _.template(templates.foo),
    initialize: function() {
        this.render();
    },
    render: function() {
        this.$el.html(this.template( {foo:foo}  ));
    },
});

这是主干模板中的内容：

templates.foo = '\
Here is the value of foo in my template: <%= foo %>  \
';

最后，你瞧，#foo-container div 获取了其中的数据（initialize当然是在我执行之后）。

问：有没有更好的方法？必须有更好的方法来做到这一点，数据通过两种不同的模板语言！

4

1 回答 1

2

是的，有更好的方法。Backbone 专为从服务器加载单个 HTML 页面的单页应用程序而设计，然后所有后续数据都通过带有 JSON 响应主体的 AJAX 加载。Backbone.Model使用正确的 URL将您的服务器端请求建模为 a 。将您的视图渲染绑定到模型的change事件。调用model.fetch()模型，它将GET为您发出 AJAX 请求。更改您的服务器端代码以发送 JSON 数据而不是带有嵌入 JavaScript 的 HTML，然后模型将接收 JSON 并将其解析为 javascript 属性，触发一个change事件，这将导致视图被呈现。

于 2012-12-07T07:13:18.343 回答