我开始使用KnockoutJS(2.2.1),SammyJS(0.7.4)和PagerJS(来自github的最新版本,带有jquery hashchange)的组合来创建单页面应用程序,但我遇到了路由问题因为它们在Chrome版本24.0.1312.57 m或Firefox 16.0中不起作用(由于某些原因,它实际上在IE7中有效)。

使用sammyjs,我指定了应用程序应响应的路由及其相应的操作,例如加载用户数据。在pagerjs中使用相同的路由来指定要显示的页面。由于某种原因,将执行sammyjs代码,但不执行pagerjs代码。

在更新路由(例如从#!/#!/user的路由)时,pagerjs不会切换到新页面,但是在#!/user?uid=123#!/user?uid=321之间切换时,数据会按预期更新。但是,当删除sammyjs代码时,它可以工作-页面之间的切换有效,但是数据当然不会正确更新。

SammyJS似乎终止了pagerjs的进一步执行,但是由于我对这些库还很陌生,所以很可能是我的代码行为不当。非常适合任何见解。

javascript代码如下所示:

    var UserModel = function () {

        var self = this;
        self.userId = null;
        self.user = ko.observable();
        self.userid = ko.observable();

        // Load
        self.load = function(userId) {
            self.loadUser(userId);
        };

        // Load user data
        self.loadUser = function(userId) {
        console.log('Loading user data');
        };

        // Client-side routes
        Sammy(function () {

            // Overview - datatables in tabs
            this.get('#!/', function () {
                console.log('Start page');
            });

            // User - details
            this.get('#!/user', function () {
                console.log('user page');
                self.userId = this.params.uid;
                self.load(self.userId);
            });

        }).run();


    }

// Renders user info
$(document).ready(function () {
    if ($('#user-info').length) {
        var userModel = new UserModel();
        pager.extendWithPage(userModel);
        ko.applyBindings(userModel);
        // Load initial data via ajax
        userModel.load();
        pager.Href.hash = '#!/';
        pager.startHashChange();
    }
    $('.dropdown-toggle').dropdown();
});


这里是带有pagerjs数据绑定的HTML:

<div class="container">

    <div data-bind="page: {id: 'start'}">
        Startpage
    </div>

    <div data-bind="page: {id: 'user', params: ['uid']}">
        User page
    </div>

</div>

最佳答案

我想我明白了。

您需要添加

this.get(/.*/, function() {
    console.log("this is a catch-all");
});


在您上一个this.get之后。然后Sammy不会停止活动。

关于javascript - Sammyjs和pagerjs路线,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/14839337/

10-11 12:26