Как сделать обновление операции CRUD в угловых js?

Question

Hii я новичок в угловых js, прямо сейчас я работаю над работой crud в угловых js, я не знаю, как делать обновление данных в angularjs, которое потребляет призывы apo для отдыха. не могли бы вы помочь мне?

мой взгляд:

 <div ng-repeat="phone in phones"> 
     <p>{{ phone.sequenceNumber}}. {{ phone.phoneNumber }} ({{ phone.phoneType }}<span ng-if="phone.isPrimary"> primary</span>)</p> 
     <button ng-click="updatePhone()" ng-model="phone.phoneNumber" class="btn btn-small btn-primary">update</button> 
    </div> 
    </div> 
</form> 

мой контроллер:

"use strict" 

ContactApp.controller("StudentController", [ 
    '$scope', 
    '$http', 

    '$state', 
    '$sce', 
    'UiString', 
    'Settings', 
    'EmergencyContact', 
    'MissingPersonContact', 
    'Address', 
    'Phone', 

    function($scope, $http,$state, $sce, UiString, Settings, EmergencyContact, MissingPersonContact, Address, Phone 
) { 

    EmergencyContact.getContacts($scope.uid).then(function(contacts) { 
     $scope.emergencyContacts = contacts; 
    }); 

    MissingPersonContact.getContacts($scope.uid).then(function(contacts) { 
     $scope.missingPersonContacts = contacts; 
    }); 

    Address.getLocalAddress($scope.uid).then(function(address) { 
     $scope.localAddress = address; 
    }); 

    Phone.getPhones($scope.uid).then(function(phone1) { 
     $scope.phones = phone1; 
    }); 



    $scope.newPhoneNumber = ''; 

    $scope.AddPhone = function() { 
     console.log("scope.newPhoneNumber",$scope.newPhoneNumber); 

     var newPhone = Phone.addPhone($scope.newPhoneNumber); 

     Phone.savePhone($scope.uid, newPhone).then(
     function(response) { 
      $scope.phones.push(newPhone); 
      return console.log("question", response); 
     }, 
     function(err) { 
      return console.log("There was an error " 
      + err); 
     }); 

     }; 

     $scope.updatePhone = function() { 


     Phone.savePhone1($scope.uid, newPhone).then(
      function(response) { 
      $scope.phones.push(newPhone); 
      return console.log("question", response); 
      }, 
      function(err) { 
      return console.log("There was an error " 
      + err); 
      }); 

     }; 



     }]); 

моя служба:

'use strict'; 

angular.module('ContactApp') 
.service('Phone', ['$q', '$http', 'Settings', function($q, $http, Settings) { 

    this.getPhones = function(id) { 
    var deferred = $q.defer(); 

    if (id) { 
     $http.get(Settings.getSetting('wsRootUrl') + 
     '/person/phone/v1/' + id + '?token=' + Settings.getToken()). 
     success(function(response) { 
     deferred.resolve(response.data); 
     }).error(function(data, status) { 
     deferred.reject(status); 
     }); 
    } else { 
     deferred.resolve({}); 
    } 

    return deferred.promise; 
    }; 

    this.addPhone = function(phoneNumber) { 
    var model = 
    { 
     "pidm": null, 
     "phoneType": "CELL", 
     "activityDate": null, 
     "isPrimary": null, 
     "phoneNumber": phoneNumber, 
     "sequenceNumber": null, 
     "status": null 
    }; 

    return model; 
    } 

    this.savePhone = function(userId, phone) { 
    var deferred = $q.defer(); 
    console.log(phone); 
    $http.post(Settings.getSetting('wsRootUrl') + 
    '/person/phone/v1/' + userId + '?token=' + Settings.getToken() 
    , [ phone ]). 
    success(function(response) { 
     deferred.resolve(response.data); 
    }).error(function(data, status) { 
     deferred.reject(status); 
    }); 

    return deferred.promise; 
    }; 

    this.updatePhone = function(phoneNumber1) { 
    var model = 
    { 
     "pidm": 123456, 
     "phoneType": "CELL", 
     "activityDate": null, 
     "isPrimary": null, 
     "phoneNumber": phoneNumber1, 
     "sequenceNumber": null, 
     "status": null 
    }; 

    return model; 
    } 
    this.savePhone1 = function(userId, phone1) { 
    var deferred = $q.defer(); 
    console.log(phone1); 
    $http.put(Settings.getSetting('wsRootUrl') + 
    '/person/phone/v1/' + userId + '?token=' + Settings.getToken() 
    , [ phone1 ]). 
    success(function(response) { 
     deferred.resolve(response.data); 
    }).error(function(data, status) { 
     deferred.reject(status); 
    }); 

    return deferred.promise; 
    }; 

}]); 

Answer 1

~~~ ~~~~ РЕДАКТИРОВАТЬ

Хорошо от чего я Собирайте это то, что вы хотите:

В HTML внутри нг-повтора:

<input type="text" ng-model="phone.phoneNumber" /> 

// в этот момент, когда пользователь вводит свой новый номер телефона в «телефон» объект уже был обновлен (с помощью двусторонней привязки данных) , Затем, если вы хотите сохранить базу данных, вы можете отправить свою услугу с помощью метода контроллера $ scope.updatePhone с помощью кнопки.

<button ng-click="updatePhone(phone)">Update</button> 

Тогда в контроллере:

$scope.updatePhone = function (phone) { 
    console.log("this is the updated phone: ",phone); 
    console.log("this is the updated phones array: ",$scope.phones); 
    // you should see that the phone number has been updated in scope. 

    Phone.updatePhone(phone); 

    // this service call should be a post to the server, not a return object as the object has already been updated. 

} 

Надеется, что это помогает

Answer 2

Вы можете найти здесь пример операции CRUD в AngularJS с Web API для выполнения Create, Read, Update и Delete функциональности. Надеюсь, это поможет вам.

CRUD Operation in AngularJS with Web API