2.7 KiB
| title | localeTitle |
|---|---|
| Keep Data in Sync in Angular | حافظ على البيانات في المزامنة في Angular |
لنفترض أنك تريد ظهور شيء ما في طريقة عرض المستخدم عند إضافته إلى قاعدة البيانات. وهناك وجوه الشيء الجديد تظهر على الفور حتى في حلقة نانوغرام تكرار في عرض HTML الخاص بك إذا كنت ببساطة إضافته إلى مجموعة محلية مع
$scope.awesomeThings.push(newThing);
ولكن ستظل بحاجة إلى إضافته إلى مجموعة قواعد البيانات الخاصة بك. أضفه إلى مجموعتك مع
$http.post('/api/things', newThing);
لكن انتظر! فسوف ندرك قريبا أنه في حين أن جميع الأشياء الأخرى الخاصة بك في مجموعة scope.awesomeThings_ لها هويات فريدة يكلفه بها MongoDB (تحت _الشيء._ الملكية id\_)، وجوه _newThing_ الخاص بك لن تقوم، والتي سوف تجعل من الصعب بالنسبة لك في مرحلة ما ل جعل الإجراءات قاعدة البيانات على أنها (حذفها من قاعدة البيانات الخاصة بك يتطلب منك استخدام _لها._ الملكية id\_). ما الذي ستفعله بعد إضافته إلى صفيف _نطاق.awesomeThings (لأننا نريده أن يظهر على صفحة المستخدم على الفور). إجمالاً ، سوف تبدو التعليمات البرمجية الخاصة بك لإضافة newThing إلى الصفيف المحلي وقاعدة البيانات الخاصة بك:
$scope.awesomeThings.push(newThing); $http.post('/api/things', newThing).success(function(thatThingWeJustAdded) { $scope.awesomeThings.pop(); // let's lose that id-lacking newThing $scope.awesomeThings.push(thatThingWeJustAdded); // and add the id-having newThing! };
هذا يقوم بتحديث الصفيف المحلي للحصول على نتائج فورية لمستخدمك ثم يقوم بمزامنتها مع قاعدة البيانات الخاصة بك ويقوم بتحديث الصفيف المحلي في الخلفية بإصدار قاعدة البيانات الخاصة بكالجهاز newThing ، الفريد . id_ وجميع. لاحظ أن رد الاتصال الذي نمرره إلى وظيفة النجاح يتلقى الشيء الجديد من قاعدة البيانات كحجة! بهذه الطريقة يمكنك بسهولة إضافتها إلى نطاقك المحلي دون الكثير من النفقات العامة.