Ng-app ve data-ng-app arasındaki fark nedir?


147

AngularJS hakkında bilgi edinmeye başladım ve ng-appve data-ng-appyönergeler arasındaki farkların ne olduğu konusunda kafam karıştı .



8
@chenrui - bu Q btw önce geldi. (24 Nisan
Blundering Philosopher

1
Uygulamanız etkilenmeyecek ve Angular, ng-app veya data-ng-app kullanıyor olsanız bile beklendiği gibi çalışacaktır, ancak @ user2289659 tarafından belirtildiği gibi, verileri kullanan- * HTML5'ten itibaren özel nitelik standardı getirilmiştir
Shujaath Khan

Yanıtlar:


124

Bu yanıtların çoğu, BU terimlerin ne anlama geldiğini açıklamadan , basitçe şablonu geçerli HTML veya HTML Doğrulayıcı Uyumlu yapar diyor .

Kesin olarak bilmiyorum, ancak bu şartların, kodunuzu standartlara uygunluk açısından tarayan HTML doğrulama programları için geçerli olduğunu tahmin ediyorum - bir tür tiftik gibi. ng-appGeçerli bir öznitelik olarak tanımıyorlar . Varsayılan olmayan HTML özniteliklerinin önüne geçilmesini beklerler.

data-attribute_name_here.

Bu yüzden, yaratıcıları, HTML doğrulayıcı programlarının onları "beğenmesi" AngularJSiçin yönergeleri için data-önlerinde yer alan alternatif isimler yaratmışlardır .


4
"Tamam. Peki," doğrulayıcı uyumlu "ne anlama geliyor?" yaklaşmak. Araştırmayı yapmış olsaydın, tahminlerin çoğunlukla doğru olduğunu anlardın. =)
slacktracer

22
Geçerli HTML, HTML doğrulayıcıları için değildir. Tarayıcılar HTML'yi ayrıştırır. HTML belirtiminden sapmaya başlarsanız, HTML'nizin doğru şekilde ayrıştırılacağının garantisi yoktur.
Blender

1
Evet, doğrulayıcılar sona ulaşmanın bir yoludur. Amaç, web sayfalarınızı, uygulamanızın gerçekte beklendiği gibi çalışacağı eski, şimdiki ve gelecekteki tarayıcıların sayısını en üst düzeye çıkaran teknik özelliklere olabildiğince yakın hale getirmektir. "Data- *" durumunda, tarayıcıların bir standart olarak aynı özelliği sunma riski de vardır ve bu da uygulamanızın özelliğiyle çakışabilir. Ayrıca, bunun gibi standartlara bağlı kalmak, araçların (örneğin, editörler) onu anlamasına ve sizin için daha kullanışlı hale getirmesine yardımcı olacaktır.
mahemoff

2
@Blender "HTML'nizin doğru bir şekilde ayrıştırılacağının garantisi yoktur", aynı şey geçerli HTML için de söylenebilir.
2014

1
@Chuck Bunu öyle ya da böyle yapmanızı önermiyorum, sadece konu çok önemli değil. Biz oradayken boşlukları ve sekmeleri tartışabiliriz. haha
twiz

41

Çalışma zamanı davranışı açısından hiçbiri, bunlar burada açıklandığı gibi yalnızca farklı adlandırma yönergeleridir: http://docs.angularjs.org/guide/directive

Direktiflerde ngBind gibi deve harfli isimler vardır. Yönerge, deve kasası adı yılan kasasına şu özel karakterlerle çevrilerek çağrılabilir:, - veya _. İsteğe bağlı olarak yönergenin önüne x- veya data- eklenebilir ve böylece HTML doğrulayıcısı uyumlu hale getirilebilir. İşte bazı olası yönerge adlarının bir listesi: ng: bind, ng-bind, ng_bind, x-ng-bind ve data-ng-bind.

Bunu okurken data-görebileceğiniz gibi, HTML'nizin HTML doğrulayıcı testlerinden geçmesi için kullanılabilir /


2
HTML spesifikasyonunun neresinde buna izin verir?
user1876508


6

Açısal ad alanını bildirebilirsiniz <html xmlns:ng="http://angularjs.org" ng-app>


2
Bu yalnızca eski uygulamalar için geçerli görünüyor: "Eğer eski stil yönergesi sözdizimini kullanmayı seçerseniz, o zaman IE'yi mutlu etmek için html'ye xml-ad alanını ekleyin. (Bu, tarihsel nedenlerden ötürü burada ve artık kullanılmasını önermiyoruz. ng :.) ". Kaynak: docs.angularjs.org/guide/bootstrap
Chuck Le Butt

5

Modern tarayıcılarda bir fark yoktur, ancak eski IE'lerde, onu tanımlayan bir XML ad alanı bildirmediğiniz sürece çalışmazlar.

Ayrıca ng-appgeçerli XHTML olmayan bir doğrulama farkı vardır ve web sayfanızın HTML doğrulamalarında başarısız olmasına neden olur. Angular, direktiflerinin önüne geçmenize data-veya x-doğrulamasına izin vermenize izin verir.


Bu sadece "ng:" kullanıyorsanız doğru görünmektedir. "Data-ng-" nin geçerli olması gerektiğine inanıyorum.
Chuck Le Butt

4

Sayfanızın HTML'sini geçerli kılmak istiyorsanız, ng- yerine data-ng- kullanabilirsiniz.
Bu olacak bir hata atmak

<div ng-app="">

  <p>Input something in the input box:</p>
  <p>Name: <input type="text" ng-model="name"></p>
  <p ng-bind="name"></p>

</div>

Bu olmaz bir hata atmak

<div data-ng-app="scope" data-ng-init="name='test'">

  <p>Input something in the input box:</p>
  <p>Name: <input type="text" data-ng-model="name"></p>
  <p data-ng-bind="name"></p>

</div>

İlk senaryonun neden bir hata verdiğini açıklar mısınız?
Awani

Bu, w3c doğrulamasına atıfta bulunuyor.
Graham P Heath

3

Bu iki terim arasındaki temel fark, data-ng-app'in HTML'yi doğrulaması ve ikincisinin yapmamasıdır. Daha fazla referans için w3Validator'ı deneyebilirsiniz.


-2

Kesinlikle ikisi arasında bir fark yoktur, ancak bazı HTML5 doğrulayıcılarının ng-app gibi bir özelliğe bir hata atması dışında, data-ng-app gibi veri ön ekli herhangi bir şey için hata vermezler. Bu nedenle, açısal yönergelerimizle veri öneki kullanmak iyidir.

Açısal yönergeleri aşağıda belirtilen şekillerde kullanabilirsiniz ng-bind, ng: bind, ng_bind, data-ng-bind, x-ng-bind

Sitemizi kullandığınızda şunları okuyup anladığınızı kabul etmiş olursunuz: Çerez Politikası ve Gizlilik Politikası.
Licensed under cc by-sa 3.0 with attribution required.