快捷導(dǎo)航

Angularjs CURD 詳解及實(shí)例代碼

更新時(shí)間：2016年09月14日 11:40:24 作者：garfieldzf

這篇文章主要介紹了Angularjs CURD 詳解及實(shí)例代碼的相關(guān)資料,需要的朋友可以參考下

Angularjs CURD

前言

基于一個(gè)手機(jī)端的項(xiàng)目使用了angularjs，硬著頭皮去用，有很多的疑問還需要一一去驗(yàn)證，剛開始總是感覺找不到北，總是感覺有很多概念，而且似乎ng既夾雜MVC又夾雜MVVM的思想，忙里偷閑敲了個(gè)簡單的CURD demo。當(dāng)然順著這個(gè)demo還可以延伸很多知識點(diǎn)，比如：帶分頁查詢、連接后臺數(shù)據(jù)庫、調(diào)用WebApi、分層使用Servcice、Factory。

效果圖

<script type="text/javascript">

    var app=angular.module('myApp',[]);

    app.controller('empCtrl',function($scope){

      $scope.emparr=[];

       

      //添加

      $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='';

      //編輯

      $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;

      }

      //修改

      $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>

以上就是對AngularJS CURD 的資料整理，后續(xù)繼續(xù)補(bǔ)充相關(guān)資料，謝謝大家對本站的支持！

您可能感興趣的文章:

相關(guān)文章

angularJS 中input示例分享
這篇文章主要介紹了angularJS 中input示例分享,需要的朋友可以參考下
2015-02-02
AngularJS實(shí)現(xiàn)多級下拉框
這篇文章主要為大家詳細(xì)介紹了AngularJS實(shí)現(xiàn)多級下拉框，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2022-03-03
AngularJS單選框及多選框?qū)崿F(xiàn)雙向動態(tài)綁定
這篇文章主要為大家詳細(xì)介紹了AngularJS單選框及多選框?qū)崿F(xiàn)雙向動態(tài)綁定的相關(guān)資料，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2016-01-01
AngularJS實(shí)現(xiàn)表單驗(yàn)證功能詳解
這篇文章主要為大家詳細(xì)介紹了AngularJS實(shí)現(xiàn)表單驗(yàn)證功能，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2017-10-10
詳解angularjs 學(xué)習(xí)之 scope作用域
本篇文章主要介紹了詳解angularjs 學(xué)習(xí)之 scope作用域，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2018-01-01
angular安裝import?echarts?from‘echarts‘標(biāo)紅報(bào)錯解決
這篇文章主要介紹了angular安裝import?echarts?from‘echarts‘標(biāo)紅報(bào)錯解決,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪
2023-10-10
AngularJS使用angular.bootstrap完成模塊手動加載的方法分析
這篇文章主要介紹了AngularJS使用angular.bootstrap完成模塊手動加載的方法,結(jié)合實(shí)例形式分析了angular.bootstrap函數(shù)手動加載模塊的步驟與相關(guān)操作技巧,需要的朋友可以參考下
2017-01-01
Angular ElementRef簡介及其使用
這篇文章主要介紹了Angular ElementRef簡介及其使用，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2018-10-10
Angular?項(xiàng)目路徑添加指定的訪問前綴
這篇文章主要為大家介紹了Angular?項(xiàng)目路徑添加指定的訪問前綴方法詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
2023-03-03
angular報(bào)錯can't resolve all parameters&nb
這篇文章主要介紹了angular報(bào)錯can't resolve all parameters for []的解決方案，具有很好的參考價(jià)值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教
2023-03-03