เมื่อเร็ว ๆ นี้ฉันได้เรียนรู้ที่จะใช้เชิงมุมและเปลี่ยนจาก jQuery UI อย่างช้าๆไปเป็นการใช้การพัฒนา NG ฉันพบความแตกต่างมากมายดังนั้นจึงเรียนรู้ต่อไป
ขั้นแรกให้สร้างบริการเพื่ออ้างอิงในคอนโทรลเลอร์ในโครงการ มีหลายรูปแบบของการดำรงอยู่ของบริการ, โรงงาน (); บริการ (); ค่าคงที่ (); ค่า (); ผู้ให้บริการ (); ในหมู่พวกเขาผู้ให้บริการเป็นพื้นฐานที่สุดและบริการอื่น ๆ เขียนขึ้นอยู่กับสิ่งนี้ ฉันจะไม่ขยายความแตกต่างเฉพาะที่นี่ คุณสามารถดูซอร์สโค้ด บริการเป็นรูปแบบที่สำคัญของการโทรระหว่างคอนโทรลเลอร์และพวกเขาจะถูกใช้มากในโครงการจริง ต่อไปนี้เป็นรหัส:
Angular.Module ('YourApp'). Factory ('MyCache', ฟังก์ชั่น ($ cachefactory) {return $ cachefactory ('mydata');});ที่นี่ 'MyCache' เป็นชื่อบริการและไม่ซ้ำกันสำหรับวัตถุแคชเฉพาะมีอยู่ในเบราว์เซอร์สำหรับการอ้างอิงโดยคอนโทรลเลอร์:
Angular.Module ('YourApp'). คอนโทรลเลอร์ ('userCtrl', ['$ scope', '$ http', 'mycache', ฟังก์ชั่น ($ scope, $ http, mycache) {// ตรวจสอบไม่ว่าจะมีข้อมูลแคชอยู่แล้ว ถ้า (แคช) {$ spope.variable = cache;} else {// รับข้อมูลจากอินเทอร์เฟซและใส่ลงในแคช var jurl = '/data/getData'; $ http ({url: jurl, วิธี: "get", ข้อมูล: "{'{': 'somevalue' }}). ความสำเร็จ (ฟังก์ชั่น (ข้อมูล, สถานะ, ส่วนหัว, config) {// บางสิ่งบางอย่างในความสำเร็จ}). ข้อผิดพลาด (ฟังก์ชั่น (ข้อมูล, สถานะ, ส่วนหัว, config) {// บางสิ่งบางอย่างในข้อผิดพลาด});}}])เมื่อหน้าเปิดเป็นครั้งแรกข้อมูลจะได้รับจากอินเทอร์เฟซ เมื่อหน้าถูกกำหนดเส้นทางข้อมูลเหล่านี้จะถูกแคชตลอดเวลา เส้นทางจะข้ามไปที่หน้าด้วยความต้องการ หากมีการตรวจสอบว่าได้รับการแคชคุณไม่จำเป็นต้องขอข้อมูลจากเซิร์ฟเวอร์ หากหน้าถูกปิดหรือรีเฟรชหน้าแคชจะหายไปและข้อมูลจะถูกร้องขออีกครั้งและแคช;
นี่เป็นตัวอย่างง่ายๆ ข้อมูลในโครงการจริงจะซับซ้อนมากขึ้น ตัวอย่างเช่นเพื่อลดการเพิ่มประสิทธิภาพหน้าเว็บการรวบรวมข้อมูลหน้าจะถูกร้องขอจำนวนคำขอข้อมูลจะลดลงและโครงสร้างข้อมูลจะซับซ้อนมากขึ้นในแต่ละเทมเพลตของเส้นทางที่กำหนดหลังจากได้รับข้อมูล
ขณะนี้ไม่มีตัวอย่างของข้อมูลขนาดใหญ่แคช ในทางทฤษฎีแคชที่นี่เป็นวัตถุวัตถุในจาวาสคริปต์ดังนั้นผลกระทบของขนาดหรือขนาดของแคชในแอปพลิเคชันที่มีประสิทธิภาพของหน้าเบราว์เซอร์จึงไม่ชัดเจน ลองขุดลึกลงไปและค้นหาความแตกต่างก่อนที่จะดำเนินการต่อ
ข้างต้นเป็นคำอธิบายโดยละเอียดเกี่ยวกับการใช้แคช $ cachefactory ใน Angular ที่แนะนำโดยตัวแก้ไข ฉันหวังว่ามันจะเป็นประโยชน์กับทุกคน หากคุณมีคำถามใด ๆ โปรดฝากข้อความถึงฉันและบรรณาธิการจะตอบกลับทุกคนในเวลา ขอบคุณมากสำหรับการสนับสนุนเว็บไซต์ Wulin.com!