单页应用程序？ 登录页面

Question

I'm a little new to programming and I'm still beginning on working with a lot of the languages.

Currently, I'm working on a project that requires me to create a login page. With a successful login, the page will change to an "Account Info" page; however, this has to be a single page application. My professor specified that the server will have no concept of "page", and that moving from "Login" to "AccountInfo" will not change the page/URL.

How do I go about calling this? We've done introduction into Angular JS, but he's never done a tutorial on single page applications.

My .js for the login looks like this:

Home.LoginClick = function () {

    $.ajax({

        url: "Home/Login",

        data: {

            Username: $(".Username").val(),

            Password: $(".Password").val(),

        },

        success: function (result) { alert(result);
            if (deserializedData.Message == "Success")
                Home.ChangeToAccountInfo();
        }

    });
}

Answer 1

Single Page application means that the client loads all the HTML in one shot, thus preventing your browser to refresh the page every time you click somewhere or go a different page. You can witness this in action by going into most websites.

It is considered best practices to use services for back end interaction. Therefore you should create a Auth. service managing your login. Create a function login - and logout. and then inject that service in your controller associated with the view thats displays the login form.

You should upon submission of the form call this login function. you can use ng-submit. after submitting the form the function that you injected in your controller will check with you backend to see if the user exist or not and then you can redirect the user toward the page you want.

You should look into the ui router for more details about how to handles your routes.