将VS 2013 SPA模板从淘汰赛转换为剑道

时间:2014-04-14 21:04:17

标签: jquery kendo-ui requirejs single-page-application

我正在关注剑道ui框架。我最初的尝试面临几个问题,我不知道如何解决它们。你的帮助将指导我更好地理解剑道:

define(['kendo', 'security-dataservice', 'security-model', 'security-helper', 'security-authservice', 'router', 'ajaxPrefilters'],
function (kendo, dataservice, model, helper, authservice, router) {
    var userInfo = new kendo.data.ObservableObject({
        userName: "",
        password: "",
        rememberMe: false,
        loggingIn: false,
        errors: [],

        loadingExternalLogin: false,
        externalLoginProviders: [],
        hasExternalLogin: function () {
            return this.get("externalLoginProviders").length > 0;
        },
        login: function () {
            //var self = this;
            //if (typeof (this.get("userInfo.errors")) !== 'undefined')
                this.get("userInfo.errors").splice(0, this.get("userInfo.errors").length);

            this.set("userInfo.loggingIn", true); // THIS LINE IS WORKING PROPERLY WHILE INSIDE .done AND .failJSON NOT WORKING

            var name = this.get("userInfo.userName");
            var pass = this.get("userInfo.password");

            dataservice.login({
                grant_type: "password",
                UserName: name,
                Password: pass // Up to here the code is working correctly**
            }).done(function (data) {
                //this.set("userInfo.loggingIn", false); // << This line does not working with "uncaught TypeError"
                this.loggingIn = false; // Is this line correct?

                if (data.userName && data.access_token) {
                    authservice.logUserIn(data.userName, data.access_token, this.rememberMe);
                } else {
                    //this.get("errors").push("An unknown error occurred.");
                    userInfo.errors.push("An unknown error occurred.");
                }
            }).failJSON(function (data) {
                this.loggingIn = false;

                if (data && data.error_description) {
                    userInfo.errors.push(data.error_description);
                } else {
                    userInfo.errors.push("An unknown error occurred.");
                }
                //if (data && data.error_description) {
                //    this.get("errors").push(data.error_description);
                //} else {
                //    this.get("errors").push("An unknown error occurred.");
                //}
            });
        }
    });

    return {
        userInfo: userInfo
    }
});

我的问题是:

1-虽然代码在Chrome和Firefox中正常运行,但Internet Explorer不会抛出.done和.failJSON。

2-为什么不能识别this.set(“userInfo.userName”)行并给出未捕获的类型错误,未定义'set'。

3- this.loggingIn = false;是否正确设置了属性loggingIn?或者我应该做些什么。

4-是否有任何模板使用kendo MVVM +需要

来涵盖Web API身份验证

仅供参考:此代码是将Visual Studio Web API SPA模板从knockout转换为kendo绑定的一步。

1 个答案:

答案 0 :(得分:0)

这里有几个范围界定问题:

首先:它应该是

this.set("loggingIn", true);

因为此上下文中的this是可观察对象,并且您要设置的属性为loggingIn

然后在传递给done()failJSON()的函数中,您需要使用userInfo.set()而不是this.set(),因为显然数据服务正在设置上下文功能:

var that = this;
dataservice.login({
    grant_type: "password",
    UserName: name,
    Password: pass // Up to here the code is working correctly**
}).done(function (data) {
    that.set("loggingIn", false); 
    // ...
})