AngularJS $ संसाधन RESTful उदाहरण


145

मैं अपनी Restful वेब सेवा को कॉल करने के लिए $ संसाधन का उपयोग करना चाहूंगा, (जो मैं अभी भी काम कर रहा हूं), लेकिन मैं यह पता लगाना चाहूंगा कि क्या मुझे मेरी AngularJS स्क्रिप्ट पहले सही मिली।

टूडो डीटीओ के पास है: {id, order, content, done}

:cmdइसलिए मैं api/1/todo/resetडेटाबेस में टूडू टेबल को खाली करने के लिए कॉल कर सकता हूं ।

यहाँ मेरी समझ की टिप्पणी के साथ कोड है:

function TodoService($resource) {
    var src = $resource('api/1/todo/:id:cmd',
              {id: "@id", cmd: "@cmd"}, //parameters default
              {
                ListTodos: { method: "GET", params: {} },
                GetTodo: { method: "GET", params: { id: 0 } },                            
                CreateTodo: { method: "POST", params: { content: "", order: 0, done: false } },
                UpdateTodo: { method: "PATCH", params: { /*...*/ } },
                DeleteTodo: { method: "DELETE", params: { id: 0 } },
                ResetTodos: { method: "GET", params: { cmd: "reset" } },
              });

    //Usage:

    //GET without ID
    //it calls -> api/1/todo
    src.ListTodos();

    //GET with ID
    //it calls -> api/1/todo/4
    src.GetTodo({ id: 4 });

    //POST with content, order, done
    //it calls -> api/1/todo
    src.CreateTodo({ content: "learn Javascript", order: 1, done: false });

    //UPDATE content only
    //it calls -> api/1/todo/5
    src.UpdateTodo({ id: 5, content: "learn AngularJS" }); 

    //UPDATE done only
    //it calls -> api/1/todo/5
    src.UpdateTodo({ id: 5, done: true });

    //RESET with cmd
    //it calls -> api/1/todo/reset
    src.ResetTodos();
}

एक खास बात मुझे यकीन नहीं है कि पाथ विधि है, मैं सब कुछ अपडेट नहीं करना चाहता, क्या मैं सिर्फ एक क्षेत्र को अपडेट कर सकता हूं? क्या मैं कोड के इस टुकड़े का सही निर्माण कर रहा हूँ?


2
ऐसा लगता है कि आप मूल $ http सेवा के रूप में $ संसाधन का उपयोग कर रहे हैं। $ संसाधन एक RESTful डेटा स्रोत से एक वस्तु प्राप्त करने, इसे हेरफेर करने, फिर इसे वापस भेजने के लिए अधिक है obj.save()। आप वह कर सकते हैं जो आप मूल $ http कार्यान्वयन के साथ करने की कोशिश कर रहे हैं।
बेन लेश

4
@ पत्थर को अपने रैस्टफुल वेब्स सर्विस के साथ संवाद करने के लिए $ संसाधन का उपयोग क्यों नहीं करना चाहिए? जैसा कि आपने कहा, क्या इसका उद्देश्य बिलकुल नहीं है?
एफ लेक्सचा

यह मेरे लिए दिखता है लेकिन मैं $ संसाधन को सेवा के रूप में परिभाषित करूंगा और इसे इंजेक्ट करूंगा। यह आपको आसानी से इसे बाद में कहीं और पुन: उपयोग करने की अनुमति देता है, यदि आपको आवश्यकता है।
एफ लेक्सचैस

4
@ ठीक है, वह $ http जैसे $ संसाधन का उपयोग कर सकता है यदि वह चाहता है। लेकिन यह वास्तव में नहीं है कि इसका उपयोग कैसे किया जाना चाहिए था।
बेन लैश

3
खैर, यह वास्तव में एक "समस्या" नहीं है, प्रति कहना है। यह अधिक है कि वह रैस्टफुल आपी और सभी संसाधनों का कोई भी फायदा नहीं उठा रहा है जो $ संसाधन आपके लिए बॉक्स से बाहर कर सकता है।
बेन लेश

जवाबों:


211

$ संसाधन एक समापन बिंदु से डेटा को पुनः प्राप्त करने, इसे हेरफेर करने और इसे वापस भेजने के लिए था। आपको इसमें कुछ मिला है , लेकिन आप वास्तव में इसका लाभ नहीं उठा रहे हैं कि यह क्या करने के लिए बनाया गया था।

अपने संसाधन पर कस्टम तरीके रखना ठीक है, लेकिन आप ओओटीबी के साथ आने वाली शांत विशेषताओं को याद नहीं करना चाहते हैं।

संपादित करें : मुझे नहीं लगता कि मैंने इसे अच्छी तरह से मूल रूप से समझाया, लेकिन $resourceरिटर्न के साथ कुछ कायरता भरा सामान है। Todo.get()और Todo.query()दोनों संसाधन ऑब्जेक्ट लौटाते हैं , और जब कॉल पूरा हो जाता है, तो इसे कॉलबैक में पास करते हैं । यह पर्दे के पीछे वादों के साथ कुछ फैंसी सामान करता है जिसका मतलब है कि आप कॉलबैक $save()से पहले कॉल कर सकते हैं get()वास्तव में आग लग जाती है, और यह इंतजार करेगा। किसी वादे then()या कॉलबैक पद्धति के अंदर अपने संसाधन से निपटने के लिए यह शायद सबसे अच्छा है ।

मानक उपयोग

var Todo = $resource('/api/1/todo/:id');

//create a todo
var todo1 = new Todo();
todo1.foo = 'bar';
todo1.something = 123;
todo1.$save();

//get and update a todo
var todo2 = Todo.get({id: 123});
todo2.foo += '!';
todo2.$save();

//which is basically the same as...
Todo.get({id: 123}, function(todo) {
   todo.foo += '!';
   todo.$save();
});

//get a list of todos
Todo.query(function(todos) {
  //do something with todos
  angular.forEach(todos, function(todo) {
     todo.foo += ' something';
     todo.$save();
  });
});

//delete a todo
Todo.$delete({id: 123});

इसी तरह, आपके द्वारा ओपी में पोस्ट किए गए मामले में, आपको एक संसाधन ऑब्जेक्ट मिल सकता है और फिर उस पर अपने किसी भी कस्टम फ़ंक्शन को कॉल कर सकते हैं (सैद्धांतिक रूप से):

var something = src.GetTodo({id: 123});
something.foo = 'hi there';
something.UpdateTodo();

मैं जाने से पहले OOTB कार्यान्वयन के साथ प्रयोग करूँगा और फिर भी मैंने अपना आविष्कार किया। और यदि आप पाते हैं कि आप किसी भी डिफ़ॉल्ट सुविधाओं का उपयोग नहीं कर रहे हैं $resource, तो आपको संभवतः $httpइसे स्वयं उपयोग करना चाहिए ।

अपडेट: कोणीय 1.2 और वादा

कोणीय 1.2 के रूप में, संसाधन वादों का समर्थन करते हैं। लेकिन उन्होंने बाकी व्यवहार को नहीं बदला।

के साथ वादे का लाभ उठाने के लिए $resource, आपको $promiseलौटे मूल्य पर संपत्ति का उपयोग करने की आवश्यकता है ।

वादों का उपयोग करते हुए उदाहरण

var Todo = $resource('/api/1/todo/:id');

Todo.get({id: 123}).$promise.then(function(todo) {
   // success
   $scope.todos = todos;
}, function(errResponse) {
   // fail
});

Todo.query().$promise.then(function(todos) {
   // success
   $scope.todos = todos;
}, function(errResponse) {
   // fail
});

बस ध्यान रखें कि $promiseसंपत्ति उसी मूल्यों पर एक संपत्ति है जो ऊपर लौट रही थी। तो आप अजीब हो सकते हैं:

ये बराबर हैं

var todo = Todo.get({id: 123}, function() {
   $scope.todo = todo;
});

Todo.get({id: 123}, function(todo) {
   $scope.todo = todo;
});

Todo.get({id: 123}).$promise.then(function(todo) {
   $scope.todo = todo;
});

var todo = Todo.get({id: 123});
todo.$promise.then(function() {
   $scope.todo = todo;
});

1
मुझे लगता है कि मैं इस तरह से अपने बयान को परिष्कृत करूंगा: यदि आप $ संसाधन की किसी भी ओओटीबी सुविधाओं का उपयोग नहीं कर रहे हैं , तो आप केवल ऑब्जेक्ट और फ़ंक्शन संदर्भों के साथ मेमोरी ले रहे हैं जिनकी आपको आवश्यकता नहीं है। यह कुछ भी चोट करने के लिए जा रहा है? शायद ऩही। लेकिन यह सिर्फ $ http का उपयोग करने के लिए अधिक कुशल हो सकता है यदि आप सिर्फ मानक CRUD संचालन कर रहे हैं और $ संसाधनों का लाभ नहीं उठा रहे हैं
बेन लेश

5
मांस, क्या कोई डॉक्स हैं जो ओओटीबी कार्यक्षमता पर जाते हैं? कोणीय डॉक्स भ्रमित कर रहे हैं।
एराइक्रूस

9
अफसोस की बात है, वहाँ वास्तव में नहीं है। मैं सिर्फ GitHub पर उनके स्रोत के माध्यम से खुदाई कर रहा हूं।
बेन लेश

2
Todo.get({id: 123});एक वादा वापस नहीं करता है और एक सीधी वस्तु नहीं है?
ingó Vals

1
शायद आप मेरे सवाल के साथ मेरी मदद कर सकते हैं: stackoverflow.com/questions/30405569/…
AJ_83

0

आप बस कर सकते हैं $scope.todo = Todo.get({ id: 123 }).get()और .query()एक संसाधन पर तुरंत एक वस्तु लौटाएं और बाद में वादे के परिणाम के साथ भरें (अपने टेम्पलेट को अपडेट करने के लिए)। यह एक विशिष्ट वादा नहीं है जिसके कारण आपको कॉलबैक या $ वादे की संपत्ति का उपयोग करने की आवश्यकता है यदि आपके पास कुछ विशेष कोड हैं जिन्हें आप कॉल के बाद निष्पादित करना चाहते हैं। लेकिन इसे कॉलबैक में अपने दायरे में निर्दिष्ट करने की आवश्यकता नहीं है यदि आप केवल टेम्पलेट में इसका उपयोग कर रहे हैं।

हमारी साइट का प्रयोग करके, आप स्वीकार करते हैं कि आपने हमारी Cookie Policy और निजता नीति को पढ़ और समझा लिया है।
Licensed under cc by-sa 3.0 with attribution required.