क्यों है $ का उपयोग कर हटाना विधि

Question

मेरी कोणीय ऐप्लिकेशन में करने के बाद दृश्य अपडेट नहीं हो मैं एक नियंत्रक के रूप में निम्नानुसार है इस संसाधन:

function TemplateListControl($scope, TemplateService){ 
    $scope.templates = TemplateService.get(); // Get objects from resource 

    // Delete Method 
    $scope.deleteTemplate = function(id){ 
     $scope.templates.$delete({id: id}); 
    } 
} 

दृश्य मैं एक मेज thats templates मॉडल करने के लिए बाध्य है के भीतर। इस प्रकार है:

<table ng-model="templates"> 
    <thead> 
     <tr> 
      <th style="width:40%">Title</th> 
      <th style="width:40%">controls</th> 
     </tr> 
    <thead> 
    <tbody> 
     <tr ng-repeat="template in templates"> 
      <td> 
       <!-- Link to template details page --> 
       <a href="#/template/[[template.id]]"> 
        [[template.title]] 
       </a> 
      </td> 
      <td> 
       <!-- Link to template details page --> 
       <a class="btn btn-primary btn-small" 
        href="#/template/[[template.id]]">Edit 
       </a> 
       <!-- Link to delete this template --> 
       <a class="btn btn-primary btn-small" 
        ng-click="deleteTemplate(template.id)">Delete 
       </a> 
      </td> 
     </tr> 
    </tbody> 
</table> 

अब जब मैं ऊपर टेम्पलेट में नष्ट लिंक पर क्लिक करें, यह deleteTemplate प्रणाली को बुलाती है और एक सफल DELETE कॉल REST API करने के लिए किया जाता है। लेकिन दृश्य को तब तक अपडेट नहीं किया जाता है जब तक इसे रीफ्रेश नहीं किया जाता है और $scope.templates = TemplateService.get(); फिर से शुरू किया जाता है। मैं क्या गलत कर रहा हूं?

Answer 1

तुम भी ग्राहक के पक्ष अपडेट करने के अपने स्रोत कोड को संशोधित रूप में नीचे

ng-click="deleteTemplate($index)"> 


$scope.delete = function (idx) { 
    var templateid = $scope.templates[idx]; 

    API.Deletetemplate({ id: templateid.id }, function (success) { 
    $scope.templates.splice(idx, 1); 
    }); 
}; 

Answer 2

आप $ संसाधन के लिए एक कॉलबैक फ़ंक्शन गुजारें सकता है। यदि $

function TemplateListControl($scope, TemplateService){ 
    $scope.templates = TemplateService.get(); // Get objects from resource 

    // Delete Method 
    $scope.deleteTemplate = function(id){ 
    TemplateService.$delete({id: id}, function(data) { 
     $scope.templates = data; 
    }); 
    } 
} 

ध्यान हटाना अपने आरईएसटी एपीआई फ़ंक्शन डिलीट करता है जो आपको सेट करने के लिए एक सरणी देता है। ऐरे: एंगुलरजेएस $ संसाधन त्रुटि से बचने के लिए आपके कोणीय $ संसाधन में सत्य - टाइप एरर: ऑब्जेक्ट # में कोई विधि नहीं है 'पुश'

$resource(URL, {}, { 
    delete: {method:'DELETE', isArray: true} 
}); 

Answer 3

मैं कॉलबैक के बजाय वादों का उपयोग कर पसंद करते हैं। एसिंक्रोनस प्रक्रियाओं को संभालने का वादा नया तरीका है। सर्वर से वापस आने के बाद आप एक वादे का उपयोग करके परिणाम का निरीक्षण कर सकते हैं।

//Controller 
myApp.controller('MyController', 
    function MyController($scope, $log, myDataService) { 

$scope.entities = myDataService.getAll(); 
$scope.removeEntity = function (entity) {  
     var promise = myDataService.deleteEntity(entity.id); 
     promise.then(
      // success 
      function (response) { 
       $log.info(response); 
       if (response.status == true) { 
        $scope.entities.pop(entity); 
       } 
      }, 
      // fail 
      function (response) { 
       $log.info(response); 
       // other logic goes here 
      } 
     ); 
    }; 
}); 

//DataService 
myApp.factory('myDataService', function ($log, $q, $resource) { 

return { 
    getAll: function() { 
     var deferred = $q.defer(); 
     $resource('/api/EntityController').query(
      function (meetings) { 
       deferred.resolve(meetings); 
      }, 
      function (response) { 
       deferred.reject(response); 
      }); 

     return deferred.promise; 
    }, 

    deleteEntity: function (entityId) { 
     var deferred = $q.defer(); 
     $resource('/api/EntityController').delete({ id: entityId}, 
      function (response) { 
       deferred.resolve(response); 
      }, 
      function (response) { 
       deferred.reject(response); 
      }); 

     return deferred.promise; 
    } 
    }; 
}); 

//Web API Controller 
public class MeetingController : BaseApiController 
{ 
    // .... code omited 

    public OperationStatus Delete(int entityId) 
    { 
     return _repository.Delete(_repository.Single<MyEntity>(e => e.EntityID == entityId)); 
    } 
} 

नोट: $ लॉग, $ q, $ संसाधन सेवाओं में बनाया जाता है। उम्मीद है कि यह मदद करता है :)