Single Page Application Login Example AngularJs – Login and Registration demo for Single Page Application Login Example AngularJS. User authentication in AngularJS, PHP, MySQL with seesion concept.
Single Page Application Login Example AngularJS
AngularJS modern JavaScript framework from Google commonly used to work with Single Page Applications (SPAs). AngularJS is open sourced under MIT license, and the development progress of AngularJS can be followed on its GitHub repository. The library is called Angular because HTML uses angular-shaped brackets.
We will create RESTful web service using PHPSlim framework as data provider. The data from the ReSTful service will be used to enable user authentication in our AngularJS application.


Just change the Config.php file only.
1 2 3 4 5 6 |
<?php define(‘DB_USERNAME’, ‘root’); define(‘DB_PASSWORD’, ”); define(‘DB_HOST’, ‘localhost’); define(‘DB_NAME’, ‘angularcode_auth’); ?> |
Then import the angularcode_auth.sql file into our MySQL database.
1 2 3 4 5 6 7 8 9 10 11 |
CREATE TABLE IF NOT EXISTS `customers` ( `uid` int(11) NOT NULL AUTO_INCREMENT, `name` varchar(50) NOT NULL, `email` varchar(50) NOT NULL, `phone` varchar(100) NOT NULL, `password` varchar(200) NOT NULL, `address` varchar(50) NOT NULL, `city` varchar(50) NOT NULL, `created` datetime NOT NULL DEFAULT CURRENT_TIMESTAMP, PRIMARY KEY (`uid`) ) ENGINE=InnoDB DEFAULT CHARSET=latin1 AUTO_INCREMENT=187 ; |

AngularJS Directives
Directives one of the most powerful part of the AngularJS framework. Using these we can create or extend the html elements.We can extensively use these AngularJS directives to create templates, to validate forms, etc.
In AngularJS, it is always recommended to manipulate the DOM using directives only.
AngularJS Model
Data Binding. The {{ firstName }} expression, in the example above, is an AngularJS data binding expression. Data binding in AngularJS binds AngularJS expressions with AngularJS data. {{ firstName }} is bound with ng-model=”firstName” .
AngularJS Repeat
Definition and Usage. The ng-repeat directive repeats a set of HTML, a given number of times. The set of HTML will be repeated once per item in a collection. The collection must be an array or an object. Just check here AngularJS Update

This is J.Vetrivel pandian completed MCA & lives in Udangudi,India. Blogging is my Passion, I love to write article about Programming. Apart from blogging, I’ll run Grocery Store that’s my Profession.