angular学习实战(1)

下面先给出angular相关的一些连接:

1. angular介绍

2.angular入门 (我感觉写的不错,简单明了)


我的实战:用户注册

后端代码,nodejs实现的restful

router.get('/registry', auth.registry);
router.get('/users/:user_id', auth.get);
router.post('/users',auth.create);

前段代码:

    1.定义自己的ng-app

'use strict';

angular.module('ebookApp',['ngResource']);

    2.定义服务

//定义通过restful获取用户信息接口
'use strict';
angular.module('ebookApp').factory('UserProxy',['$resource', function($resource){
    return $resource('/users/:user_id',{user_id:'@id'});
}]);

    3.定义controller

'use strict';

//创建服务
angular.module('ebookApp').controller('AuthController',function($scope,$location,UserProxy){
    $scope.email = '[email protected]';
    $scope.password = '';
    $scope.repassword = '';

    $scope.registry = function(){
        if(!$scope.password){
            alert("请输入密码");
            return false;
        }

        if($scope.password!==$scope.repassword){
            alert("两次密码不一致");
            return false;
        }

        var user = UserProxy.save({email:$scope.email, password:$scope.password});
        if(user){
            //做跳转处理
        }
    }
});

html 中按照顺序加载代码:(注意,需要按照一定顺序加载)

    script(src="http://cdn.bootcss.com/angular.js/1.3.0-beta.7/angular.js")
    script(src="http://cdn.bootcss.com/angular.js/1.3.0-beta.7/angular-resource.min.js")
    script(src="/angular/index.js")
    script(src="/angular/services/user.js")
    script(src="/angular/controllers/auth.js")

    1.加载angular.js [免费CDN]

    2.加载service

    3.加载 controllers

 设置ng-app属性 <html ng-app='ebookApp'>

html(ng-app='ebookApp')

 设置data-ng-controller作用域,我设置的作用域为form

form(class="form-horizontal",role="form",data-ng-controller="AuthController")

 设置提交按钮ng-click时间为click

button(type="submit",class="btn btn-default",ng-click="registry()") 注册


你可能感兴趣的:(Angular,nodejs)