Service, directive ve module arasındaki fark nedir?

Birçok dokümanı okuyorum ve gittikçe kafam karışıyor. Temelde bir arasındaki farkı anlayamıyorum

• hizmet
• direktif
• modül

Birçok özel bileşen görüyorum. Bazen direktifler, bazen de hizmetler kullanıyorlar. Her zaman bir modül ile başlar. Birisi bu üç tip arasındaki farkın ne olduğunu bir örnekle açıklayabilir mi?

Bir modülü direktifler, hizmetler, sabitler vb. Gibi bir dizi başka şeyi kablolamak için bir yer olarak düşünün.

Açısal bir uygulama yazarken, uygulama kodunuz olan (şablonlar olmadan) üst düzey bir modülünüz olur.

Hizmetler çoğunlukla denetleyiciler arasında iletişim kurmanın bir yoludur, ancak bir hizmeti diğerine enjekte edebilirsiniz. Hizmetler genellikle veri depolarınıza ulaşmanın bir yolu olarak kullanılır ve insanlar ngResource gibi açısal API'leri sarar. Bu teknik, testi (özellikle alaycılığı) oldukça kolay hale getirdiğinden faydalıdır. Kimlik doğrulama, günlük tutma vb. Gibi diğer şeyleri yapmak için hizmetlere sahip olabilirsiniz.

Yönergeler, widget oluşturmak veya jquery eklentileri gibi mevcut şeyleri sarmak için kullanılır. Mevcut eklentileri kaydırmak zor olabilir ve bunu yapmanın nedeni eklentiler ile açısal arasında iki yönlü bir veri bağlantısı oluşturmaktır. İki yönlü veri bağlamaya ihtiyacınız yoksa, bunları sarmanıza gerek yoktur.

Bir yönerge ayrıca DOM manipülasyonu yapmak, DOM olaylarını yakalamak vb. İçin bir yerdir. Denetleyicilerde veya hizmetlerde DOM ile ilgili şeyler yapmamalısınız. Direktifler oluşturmak oldukça karmaşık olabilir. IMHO, öncelikle aradığınızı yapabilecek bir şey için API'ye bakmanızı VEYA Angular'ın Google Grubundan tavsiye istemenizi öneririm.

Kendi kişisel notlarımdan (çoğunlukla dokümanlar, google grup yayınları ve SO yayınlarından snippet'ler):

Modüller

• ad alanı / grup hizmetleri, yönergeler, filtreler, yapılandırma bilgileri ve başlatma koduna bir yol sağlar
• global değişkenlerden kaçınmaya yardım et
• $ enjektörünü yapılandırmak için kullanılır ve modül (veya tüm modülün kendisi) tarafından tanımlanan şeylerin başka bir yere enjekte edilmesine izin verir (Bağımlılık Enjeksiyon maddeleri)
• Açısal modüller CommonJS veya Require.js ile ilişkili değildir. AMD veya Require.js modüllerinin aksine, Açısal modüller komut dosyası yükleme sırası veya tembel komut dosyası getirme sorununu çözmeye çalışmaz. Bu hedefler dikeydir ve her iki modül sistemi yan yana yaşayabilir ve hedeflerini gerçekleştirebilir (böylece dokümanlar iddia eder).

Hizmetler

• tekil öğeler olduğundan, tanımladığınız her hizmetin yalnızca bir örneği vardır. Tektonlar olarak, kapsamlardan etkilenmezler ve bu nedenle birden çok görünüm / denetleyici / yönerge / diğer hizmetler tarafından erişilebilir (bunlarla paylaşılabilir)
• Aşağıdaki durumlarda özel hizmetler oluşturabilirsiniz (ve muhtemelen de oluşturmanız gerekir)
  • iki veya daha fazla şeyin aynı verilere erişmesi gerekir (kök kapsamı kullanmayın) veya verilerinizi düzgün bir şekilde kapsüllemek istiyorsanız
  • bir web sunucusuyla etkileşimleri kapsüllemek istersiniz (hizmetinizde $ resource veya $ http'yi genişletin)
• Yerleşik hizmetler '$' ile başlar.
• Bir servisi kullanmak için, bağımlıya bağımlılık enjeksiyonu gerekir (örn. Kontrolöre veya başka bir servise veya yönerge).

Direktifler (aşağıdaki öğelerin bazıları aslında aynı şeyi söylüyor, ancak bazen biraz farklı bir ifadenin çok yardımcı olduğunu buldum)

• durumu değiştiğinde DOM'u güncellemekten sorumludur
• HTML kelime dağarcığını genişlet = yeni HTML kodları öğret.
  Açısal, web uygulamaları oluşturmak için yararlı olan yerleşik bir yönergeler dizisi (örn. Ng- * şeyler) ile birlikte gelir, ancak HTML'yi bildirici bir Etki Alanına Özel Dile (DSL) dönüştürülebilecek şekilde ekleyebilirsiniz. Örneğin, Açısal ana sayfa demosu "Bileşenler Oluşturma" bölümündeki <tabs> ve <pane> öğeleri.
  • Açık olmayan yerleşik yönergeler (çünkü "ng" ile başlamazlar): a, form, input, script, select, textarea. Açısal altında, bunların hepsi normalden daha fazlasını yapar!
• Yönergeler "HTML'yi bileşenlendirmenize" izin verir. Direktifler genellikle ng-include'ten daha iyidir. Örneğin, temel olarak veri bağlama özelliğiyle çok sayıda HTML yazmaya başladığınızda, bu HTML'yi (yeniden kullanılabilir) yönergelere dönüştürün.
• Açısal derleyici, herhangi bir HTML öğesine veya özelliğe davranış eklemenize ve hatta özel davranışa sahip yeni HTML öğeleri veya nitelikler oluşturmanıza olanak tanır. Angular bu davranış uzantıları yönergelerini çağırır .
  • Hepsini kaynattığınızda, yönerge sadece Açısal derleyici DOM'da karşılaştığında çalışan bir işlevdir.
• Yönerge, bir öznitelik, öğe adı, sınıf adı veya yorumdaki bir adın varlığıyla tetiklenen bir davranış veya DOM dönüşümüdür. Yönerge, (HTML) derleme işleminde belirli HTML yapılarıyla karşılaşıldığında tetiklenmesi gereken bir davranıştır. Direktifler eleman isimlerine, niteliklere, sınıf isimlerine ve yorumlara yerleştirilebilir.
  • Direktiflerin çoğu yalnızca özelliklerle sınırlıdır. Örneğin, DoubleClick yalnızca özel özellik yönergelerini kullanır.
• ayrıca bkz. Angularjs direktifi nedir?

Modüllerde açısal şeyleri (bağımlılık enjeksiyon maddeleri) tanımlayın ve gruplandırın.
Verileri paylaşın ve web sunucusu etkileşimini hizmetlere sarın.
HTML'yi genişletin ve yönergelerde DOM manipülasyonu yapın.
Ve Denetleyicileri olabildiğince "ince" yapın.