我有一个测试应用程序，其中包括require.js，jQuery的，jQueryMobile（JQM），敲除和萨米一个设置
require.js在JQM，敲除和萨米负荷
应用程序主页上我使用萨米加载在淘汰赛的ViewModels。 这些的ViewModels在模板中的负荷..
所以显示代码...
要求页：
require.config({
jquery: 'vendor/jqm/jquery_1.7_min',
jqm: 'vendor/jqm/jquery.mobile-1.1.0',
knockout: 'vendor/knockout/knockout-2.2.0',
sammy : 'vendor/sammy/sammy',
text: 'vendor/require/text',
views: '../views',
templates: '../templates'
}
});
define(['app','jqm-config'], function(app) {
$(document).ready(function() {
console.log("DOM IS READY");
});
});
app.js
define(['jquery','knockout', 'sammy','views/home/home', 'views/products/products', 'jqm'],
function($, ko, sammy, appViewModel, productsViewModel) {
var self = this;
self.goHome = function() {
ko.applyBindings(new appViewModel());
};
self.goProducts = function() {
ko.applyBindings(new productsViewModel());
};
Sammy(function() {
this.get('#home', function() {
self.goHome();
});
this.get('#products', function() {
self.goProducts();
});
this.get('', function() {
self.goHome();
});
}).run();
});
产品页面
define(['jquery', 'knockout','text!templates/test2.html', 'jqm'],
function($, ko, productsViewTemplate){
function ProductType(id, name) {
var self = this;
self.id = id;
self.name = name;
}
return function productsViewModel() {
$('body').append(productsViewTemplate);
var self = this;
self.products = ko.observableArray();
var jqxhr = $.getJSON("data/product.json")
.success(function(data, status, xhr) {
self.products.removeAll();
$.each(data.data.productTypeList, function(i,item){
self.products.push(new ProductType(i, item.longName));
})
})
.error(function() { alert("error"); })
.complete(function() {
$.mobile.changePage( '#products', { transition: "pop"});
});
}
});
产品HTML（text2.html）
<div data-role="page" data-theme="c" class="ui-page" id="products">
<div data-role="header" data-position="fixed">
<h1>Products</h1>
<a href="#home" data-icon="home" data-iconpos="notext" data-direction="reverse">Home</a>
</div>
<div data-role="content">
<ul data-role="listview" data-inset="true" data-bind="foreach: products" >
<li>
<a data-bind="attr:{href:'#products/list/' + id}, text: name"></a>
</li>
</ul>
</div>
有几个问题
被萨米应该按照这个顺序来加载，因为现在每一次当我刷新它抛出萨米或jQuery是不是由于过于缓慢的加载我猜测定义的错误
如果有人去从主页上的产品页面上加载OK，因为jQueryMobile changePage被称为但是如果用户然后刷新该页面，即已经从JSON名单失去其所有的造型..
我想这是因为我呈现从模板的页面，然后不得不做出的排行榜，但我想不出这样做的另一种方式的方式。
所以我想（概率不是最好的解决办法），但有没有办法来强制刷新一个pageChange？ 或者有没有人有一个更好的解决方案？
3。
这是在外部模板调用的最好方法/有没有更好的方式来追加模板身体。 我真的觉得时间其采取做那是什么导致的造型问题，还当我的产品其开始移动到下一个前呈现他们此页面上的一个新的水平增加..
我在努力寻找与基因敲除和requirejs外部模板加载的最佳方式。 我想保持在HTML模板，让其他人在队中可以编辑很容易够了，给的结构。
这个演示可以在这里看到
http://demo.stg.brightonconsulting.net.au/templates/tests/knockoutJQMProducts/
非常感谢所有帮助
