找到你要的答案

Q:how to create dynamic service and factory in angular for $http and post using controller

Q:如何为HTTP和使用后控制器创建角动态服务和工厂

var drc = angular.module('DirectiveControllers',[]);

drc.controller('HeaderDrcCtrl', ['$scope','$http', function ($scope,$http) {
  if($.cookie('userEmail') != '') {
    $('#logout').show();
    $('#login').hide();
  }   

  $(document).on('click','#editForm', function() {
    $('#showEdit').show();
    $('#hideRegister').hide();
  });

  $scope.user = {};
  $scope.customers = {};
  $scope.signUp = function () {
    $http.post('/api/customers', {firstname: $scope.user.firstname, lastname: $scope.user.lastname, username:$scope.user.username, email:$scope.user.email, password: $scope.user.password})
      .success(function(data){
        $scope.customers.push({firstname: $scope.user.firstname, lastname: $scope.user.lastname, username:$scope.user.username, email:$scope.user.email, password: $scope.user.password});
        $scope.regMessage = data.Message;
        $scope.user = {};
      })
      .error(function(data){
          console.log('Error: ' + data);
      });
    }
  }]);

This is the my code which is directly using controller. But I want to divide in services and controller which is the best way to do that. Any quick help would be appreciated.

Thanks Raghvendra

var drc = angular.module('Directive控制器s',[]);

drc.controller('HeaderDrcCtrl', ['$scope','$http', function ($scope,$http) {
  if($.cookie('userEmail') != '') {
    $('#logout').show();
    $('#login').hide();
  }   

  $(document).on('click','#editForm', function() {
    $('#showEdit').show();
    $('#hideRegister').hide();
  });

  $scope.user = {};
  $scope.customers = {};
  $scope.signUp = function () {
    $http.post('/api/customers', {firstname: $scope.user.firstname, lastname: $scope.user.lastname, username:$scope.user.username, email:$scope.user.email, password: $scope.user.password})
      .success(function(data){
        $scope.customers.push({firstname: $scope.user.firstname, lastname: $scope.user.lastname, username:$scope.user.username, email:$scope.user.email, password: $scope.user.password});
        $scope.regMessage = data.Message;
        $scope.user = {};
      })
      .error(function(data){
          console.log('Error: ' + data);
      });
    }
  }]);

这是我的代码,是直接使用控制器。但我想划分服务和控制器这是最好的方法。任何快速帮助将不胜感激。

谢谢Raghvendra

answer1: 回答1:

You service would return ajax promise from it. And about controller you shouldn't have jQuery in it. You can easily replace those jquery by ng-show or ng-if directive easily.

Service

drc.service('ajaxService',['$http' function($http){

  this.get = function(url){
    reutrn $http.get(url);
  }

  this.post = function(url, data){
    reutrn $http.post(url, data);
  }

}]);

Controller

drc.controller('HeaderDrcCtrl', ['$scope', 'ajaxService', function($scope, ajaxService) {
    if ($.cookie('userEmail') != '') {
        //alert($.cookie('userEmail'));
        $scope.showLogout = true;
        $scope.showLogin = false;
    }

    $(document).on('click', '#editForm', function() {
        //alert(1);
        $scope.showEdit = true;
        $scope.hideRegister = true;
    });

    $scope.user = {};
    $scope.customers = {};
    $scope.signUp = function() {

        ajaxService.post('/api/customers', {
                firstname: $scope.user.firstname,
                lastname: $scope.user.lastname,
                username: $scope.user.username,
                email: $scope.user.email,
                password: $scope.user.password
            })
            .success(function(data) {
                $scope.customers.push({
                    firstname: $scope.user.firstname,
                    lastname: $scope.user.lastname,
                    username: $scope.user.username,
                    email: $scope.user.email,
                    password: $scope.user.password
                });
                $scope.regMessage = data.Message;

                console.log($scope.regMessage);
                $scope.user = {};
                // console.log( $scope.customers);
            })
            .error(function(data) {
                console.log('Error: ' + data);
            });
    }
}]);

Markup

<div ng-if="showLogin">Login</div>
<div ng-if="showLogout">Logout</div>

Markup contain will shown if only showLogin is true then it will show Login div, same thing applied for the Logout div..If expression is true then only that div will be shown,

你的服务会返回阿贾克斯承诺从它。关于控制器的你不应该在这个jQuery。你可以很容易地取代那些jQuery Ng显示或如果指令很容易。

服务

drc.service('ajax服务',['$http' function($http){

  this.get = function(url){
    reutrn $http.get(url);
  }

  this.post = function(url, data){
    reutrn $http.post(url, data);
  }

}]);

控制器

drc.controller('HeaderDrcCtrl', ['$scope', 'ajax服务', function($scope, ajax服务) {
    if ($.cookie('userEmail') != '') {
        //alert($.cookie('userEmail'));
        $scope.showLogout = true;
        $scope.showLogin = false;
    }

    $(document).on('click', '#editForm', function() {
        //alert(1);
        $scope.showEdit = true;
        $scope.hideRegister = true;
    });

    $scope.user = {};
    $scope.customers = {};
    $scope.signUp = function() {

        ajax服务.post('/api/customers', {
                firstname: $scope.user.firstname,
                lastname: $scope.user.lastname,
                username: $scope.user.username,
                email: $scope.user.email,
                password: $scope.user.password
            })
            .success(function(data) {
                $scope.customers.push({
                    firstname: $scope.user.firstname,
                    lastname: $scope.user.lastname,
                    username: $scope.user.username,
                    email: $scope.user.email,
                    password: $scope.user.password
                });
                $scope.regMessage = data.Message;

                console.log($scope.regMessage);
                $scope.user = {};
                // console.log( $scope.customers);
            })
            .error(function(data) {
                console.log('Error: ' + data);
            });
    }
}]);

标记

<div ng-if="showLogin">Login</div>
<div ng-if="showLogout">Logout</div>

标记 contain will shown if only showLogin is true then it will show Login div, same thing applied for the Logout div..If expression is true then only that div will be shown,

answer2: 回答2:

i am a first user and i am logging in to page. and another second user who also loggedin to the site.

i login first in to site and the second user after me . So i have to playing 20 sec my turn overs and second user turn starts after 20 sec my turn again comes. I am doing this code in socket.io and node.js and jquery and html so any please can help me .

Thanks Raghvendra Singh

我是第一个用户,我登录到页面。另一个第二用户谁也登陆到网站。

我登录第一次到网站和第二个用户后,我。所以我要打20秒我的失误和第二用户将开始20秒后,又轮到我了。我这样做socket.io和Node.js和jQuery代码和HTML等任何能帮助我。

谢谢Raghvendra Singh

angularjs