Knockout.js 无法将jqwidgets与knockout和requirejs一起使用
我会再试一次,我一直在试图找到一个解决方案,在一个单页应用程序中使用jqwidgets和knockout和requirejs My index.html:Knockout.js 无法将jqwidgets与knockout和requirejs一起使用,knockout.js,requirejs,jquery-widgets,Knockout.js,Requirejs,Jquery Widgets,我会再试一次,我一直在试图找到一个解决方案,在一个单页应用程序中使用jqwidgets和knockout和requirejs My index.html: <script src="app/require.config.js"></script> <script data-main="app/startup" src="bower_modules/requirejs/require.js"/> index.html调用的My startup.js defin
<script src="app/require.config.js"></script>
<script data-main="app/startup" src="bower_modules/requirejs/require.js"/>
index.html调用的My startup.js
define(['jquery', 'knockout', './router', 'bootstrap', 'knockout-projections', 'jqx-all'], function ($, ko, router) {
ko.components.register('nav-bar', { require: 'components/nav-bar/nav-bar' });
ko.components.register('home-page', { require: 'components/home-page/home' });
ko.components.register('study-selection', { require: 'components/study-selection/study-selection' });
ko.applyBindings({ route: router.currentRoute });
});
它使用同样来自yeoman的router.js:
return new Router({
routes: [
{ url: '', params: { page: 'home-page' } },
{ url: 'study-selection', params: { page: 'study-selection' } }
]
});
function Router(config) {
var currentRoute = this.currentRoute = ko.observable({});
ko.utils.arrayForEach(config.routes, function(route) {
crossroads.addRoute(route.url, function(requestParams) {
currentRoute(ko.utils.extend(requestParams, route.params));
});
});
activateCrossroads();
}
function activateCrossroads() {
function parseHash(newHash, oldHash) { crossroads.parse(newHash); }
crossroads.normalizeFn = crossroads.NORM_AS_OBJECT;
hasher.initialized.add(parseHash);
hasher.changed.add(parseHash);
hasher.init();
}
})
每当我打开索引页时,我都可以看到jqx-all被加载。
但是,当我尝试在任何页面中使用jquery小部件时,它们都不会被呈现。
study-selection.html:
<div id="jqxCheckBox" data-bind="jqxCheckBox: { checked: checked, disabled: disabled, width: '120px' }" style='margin-bottom: 10px;'>jqxCheckBox</div>
我一直在看有关的例子
但我找不到解决问题的办法。有没有调试的方法?
我错过什么了吗
非常感谢您的帮助
亲切的问候,我终于明白了。
似乎我不得不说:
$('#jqxcheckbox').jqxCheckBox({ width: 120, height: 25 });
以呈现studyselection.js文件中的复选框。
尽管jqwidgets演示页面上的示例中没有显示这一点。您使用了ko.applyBindings吗?是的,绑定没有问题。
define(['knockout', 'text!./study-selection.html'], function (ko, templateMarkup) {
function Studyselection(params) {
this.message = ko.observable('Hello from the studySelection1 component!');
this.disabled = ko.observable(false);
}
return { viewModel: Studyselection, template: templateMarkup };
});
$('#jqxcheckbox').jqxCheckBox({ width: 120, height: 25 });