Angularjs CURD Detailed Explanation and Example Code

Angularjs CURD

Introduction

　　　　　　 Based on a mobile project that uses angularjs, I went ahead and used it despite having many doubts that needed to be verified one by one. At the beginning, I always felt lost, as if there were many concepts, and it seemed that ng combined the ideas of MVC and MVVM. I took a break to knock out a simple CURD demo. Of course, following this demo, many other knowledge points can be extended, such as: pagination query, connecting to the back-end database, calling WebApi, and layered use of Service, Factory.

Effect Image

<script type="text/javascript">
    var app=angular.module('myApp',[]);
    app.controller('empCtrl',function($scope){
      $scope.emparr=[];
      //Add
      $scope.btnclk=function(){
        $scope.emparr.push({'arr_id':$scope.id,'arr_name':$scope.name,'arr_desg':$scope.desg});
        $scope.id='';
        $scope.name='';
        $scope.desg='';
      }
      var key='';
      //Edit
      $scope.edit=function(emp,indx){
        key=indx;
        console.log(indx);
        console.log(emp);
        $scope.id=emp.arr_id;
        $scope.name=emp.arr_name;
        $scope.desg=emp.arr_desg;
      }
      //Modify
      $scope.btnupd=function(id,name,desg){
        $scope.emparr[key].arr_id=id;
        $scope.emparr[key].arr_name=name;
        $scope.emparr[key].arr_desg=desg;
        $scope.id='';
        $scope.name='';
        $scope.desg='';
      }
      $scope.del=function(id){
        $scope.emparr.splice(id,1);
      }
    });
  </script> 

This is the compilation of AngularJS CURD information. We will continue to supplement relevant information, thank you all for your support to this site!

Statement: The content of this article is from the Internet, and the copyright is owned by the original author. The content is contributed and uploaded by Internet users spontaneously. This website does not own the copyright, has not been edited manually, and does not assume any relevant legal liability. If you find any content suspected of copyright infringement, please send an email to: notice#oldtoolbag.com (When sending an email, please replace # with @ to report abuse, and provide relevant evidence. Once verified, this site will immediately delete the content suspected of infringement.)