0 beğenilme 0 beğenilmeme
98 gösterim

angularjs nedir

Google mühendislerinin geliştirmeye başladığı ve sonradan birçok developerın dahil olduğu açık kaynak kodlu javascript kütüphanesidir. MVC yapısıyla gelen AngularJs, SPA sayfalar geliştirmenize olanak tanıyan bir javascript kütüphanesidir.

Eğer kullanmaya kara verdiyseniz jQuery’den vazgeçmelisiniz. Aslında beraber çalışabiliyorlar ancak en ufak karışıklıkla işler çıkılmaz bir noktaya gelebilir. Ancak çok çok çok önemli bir kütüphaneye ihtiyacınız yok ise jQuery kullanmanıza zaten gerek yok çünkü AngularJs zaten jQuery’nin jQLite ismini verdiği element kütüphanesini içinde bulunduruyor. Hangi fonksiyonlar olduğunu merak ediyorsanız buraya tıklayarak detaylı bilgi alabilirsiniz.

AngularJs nasıl kullanılır ?

Şuanki versiyonu 1.5.0 resmi websitesi'nden projemize dahil edeceğiz.

Öncelikle boş bir index.html dosyası hazırlıyoruz.

<!DOCTYPE html>
<html>

  <head>
    <title>Merhaba AngularJs | uzmancoder.com</title>
  </head>

  <body>
    <h1>Merhaba Angular Js!</h1>
  </body>

</html>

Öncelikle Angularjs.org sitesine girerek AngularJs 1 kütüphanesini indiriyoruz.

Orada göreceğiniz AngularJs 2 var ancak ona sonra değineceğiz.

Aşağıdaki resimleri takip ederek gerekli javascript dosyası için CDN adresini kopyalıyoruz.

angularjs indir

angularjs indir

Aldığımız CDN linkini sayfamıza body tagından hemen önce ekleyelim.

HTML dosya mızın son hali aşağıdaki gibi olacak;

<!DOCTYPE html>
<html>

  <head>
    <title>Merhaba AngularJs | uzmancoder.com</title>
  </head>

  <body>
    <h1>Merhaba Angular Js!</h1>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.min.js"></script>
  </body>

</html>

Evet artık sayfamıza javascript dosyasını dahil ettik. Ancak jQuery v.b gibi kütüphaneler gibi hemen kullanamıyoruz. Öncelikle hangi alanda kullanacağımızı ng-app direktifi ile belirtmeliyiz.

Belirtmeden önce neden böyle birşey var onu açıklayalım. Siz sitenizin her bir köşesinde Angularjs kullanmak zorunda değilsiniz. Bir kısmında (mesela sadece header) kullanmak isterseniz ng-app direktifini o kısımın olduğu div etiketine verebilirsiniz. Genellikle html yada yada body tagına eklenir çünkü birçok kişi tüm sitede angularjs’nin hakim olmasını ister. Ancak istisnalar olabilir ve bu bilgiyide aktarmak istedim.

Şimdi Html tagımıza ng-app direktifini yazıyoruz ve Angularjs’nin tüm sayfada çalışmasını istediğimizi söylüyoruz. Html kodumuz şu şekilde oluyor;

<!DOCTYPE html>
<html ng-app>

  <head>
    <title>Merhaba AngularJs | uzmancoder.com</title>
  </head>

  <body>
    <h1>Merhaba Dünya</h1>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.min.js"></script>
  </body>

</html>

Artık AngularJs’nin tüm nimetlerinden yararlanabiliriz. Ben bu konuda kısaca bir giriş yapacağım. Sonra ki makalelerimizde detaylı anlatımlara geçeceğiz.

Şimdi bir inputumuz olsun ve içine ne yazarsak yazalım istediğimiz bir etiketin içine onu yazsın. Örnek;

<!DOCTYPE html>
<html ng-app>

  <head>
    <title>Merhaba AngularJs | uzmancoder.com</title>
  </head>

  <body>
    <input type="text" ng-model="inputModel" />
    <h1>{{inputModel}}</h1>
    
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.0/angular.min.js"></script>
  </body>

</html>

Yukarıdaki html sayfasını yaptığınıda inputun içine ne yazarsanız h1 etiketinde yazıldığını göreceksiniz.

Bunu ngModel direktifi sayesinde yaptık.

Ayrıca html içinde AngularJs değişkenlerini kullanmak için {{değişken}} şeklinde kullanıyoruz.

4 Ağustos Javascript kategorisinde serhat.öcal Uzman Coder (13,350 puan) paylaştı | 98 gösterim

Bu soruya cevap vermek için lütfen giriş yapınız veya kayıt olunuz.

uzmancoder.com'a Hoşgeldiniz. Sitemiz 24.06.2017 tarihinde kurulan bir soru-cevap platformudur.

Siz de aklınıza takılan soruları sorabilir veya diğer sorulara cevaplar yazabilirsiniz.

BU AY EN AKTİF ÜYELER

    96 soru

    81 cevap

    19 yorum

    122 üye

    ×

    Bizi Takip Edin!

    Bumerang - Yazarkafe

    comodo ssl




    96 soru
    81 cevap
    19 yorum
    122 üye