如何與骨幹網同步加載外部模板

Question

我正在嘗試使用phonegap，backbone.js和coffeescript構建移動應用程序。我想要做這樣的事情：

class MyApplication.Views.EntriesIndex extends Backbone.View 
    template: load('my/template') //It will load the external file my/template.tpl 

    render: -> 
    $(@el).html(@template()) 
    this 

我想同步加載它。我已經看到require.js，但我覺得這太簡單了。我看到比我可以使用JST作爲rails應用程序，但是我沒有找到如何在沒有鏈接的情況下使用它，我的應用程序只能在客戶端工作。

什麼是更好的方式同步加載模板？

我認爲最好是預加載它。

我的應用程序將託管在客戶端。

Answer 1

我這樣做：

class HomeView extends Backbone.View 
    template: -> 
    template = "views/home.html" 
    cache = window.templates[template] 
    return cache if cache 

    cache = $.ajax(
     url: "views/home.html" 
     async: false).responseText 

    window.templates[template] = cache 
    return cache 

    render: -> 
    @$el.html(@template()) 

而且，在我的應用程序的initalization：

window.templates = {} 

所以我可以異步加載模板，並將它緩存。顯然，我會做一些重構，並且可能會將它放入JQuery函數中。

感謝您的幫助。

編輯

更改我的代碼來做到這一點：

class Loader 
    @files: {} 
    @load: (path) -> 
    return @files[path] ||= $.ajax(url: path, async: false).responseText 

現在我可以這樣做：

class HomeView extends Backbone.View 
    template: -> 
    Loader.load("views/home.html") 

    render: -> 
    @$el.html(@template()) 

這是JavaScript的版本：

var Loader; 

Loader = (function() { 

    function Loader() {} 

    Loader.files = {}; 

    Loader.load = function(path) { 
    var _base; 
    return (_base = this.files)[path] || (_base[path] = $.ajax({ 
     url: path, 
     async: false 
    }).responseText); 
    }; 

    return Loader; 

})(); 

我可能會在github上發佈代碼...

Answer 2

如果您的應用程序作爲一個PhoneGap的應用程序，你可能也包括你的模板，在HTML：

Explanation of <script type = "text/template"> ... </script>

最新問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.

 相關問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.