angglarは実戦を学ぶ(1)
まず、angglarに関するいくつかの接続を与えます.
1.anglar紹介
2.angglar入門(よく書けたと思います.分かりやすいです.)
私の実戦:ユーザー登録
バックエンドコード、nodejs実現のretsful
1.自分のng-apを定義する
2.serviceの読み込み
3.ロードcontrollers
を設定します.
1.anglar紹介
2.angglar入門(よく書けたと思います.分かりやすいです.)
私の実戦:ユーザー登録
バックエンドコード、nodejs実現のretsful
router.get('/registry', auth.registry);
router.get('/users/:user_id', auth.get);
router.post('/users',auth.create);
前のコード:1.自分のng-apを定義する
'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.angglar.js[無料CDN]をロードする.2.serviceの読み込み
3.ロードcontrollers
を設定します.
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()")