Merhaba arkadaşlar bu makalemde kendimize bir filter yazarak istediğimiz metini sef Url yada seo ya uyumlu url haline dönüştüreceğiz .(Ör : Türkçe Karakter=> turkce-karakter) Bunun için oluşturduğumuz app.js dosyasına aşağıdaki gibi filter kodlarımızı yazıyoruz;
Kodların açıklanmasına gelince filterımızın adı sefUrl ve aşağıda iki tane dizi oluşturuyoruz birisi türkçe karakterlerden oluşuyor diğeri de onların ayerine geçecek olan karakterler.
fonksiyonumuza aldığımız parametrenin adı “deger” olsun ve biz bu gelen string (yazının tamamını) foreach ile karakter karakter döndürüyoruz ve eğer “turkce” dizisinden eşleşen bir karakter olursa örneğin “ş” gibi bunu “duzgun” dizisindeki “s” ile değiştiriyoruz
Daha sonra tüm karakterleri toLowerCase ile küçük karakter haline getiriyoruz. Buraya kadar sadece harflerdeki sıkıntıyı hallettik bundan sonra ise harf ve sayı harici diğer tüm karakterlerin yerine “-“işareti ekliyoruz bunu da kısa bir regEx ifadesi ile yazıyoruz açıklaması şöyle ki ;
replace(/[^A-Za-z0-9]/g, “-“) //Buradaki ^ifadesi belirlediğimiz (A dan Z ye a dan z ye 0 dan 9a) HARİÇ ifadesini sağlamaktadır. // sondaki “g” ifadesi ise gördüğü tüm karakterleri değiştirmesi anlamına gelmektedir. Eğer “g” yi yazmazsak sadece ilk gördüğü türkçe karakteri değiştirir 2 ve daha sonrasını değiştirmez bu ifade ile tüm stringdeki örneğin “ş” harfleri “s” olarak değiştirecektir. Dedikte sonra return ile bu ifadeyi geri döndürüyoruz.
Peki bunun kullanımı nasıl diye soracak olursak ;
örneğin controller tarafında şöyle bir değişkenimiz olsun;
$scope.Link = “Bugün hava ne kadar güzel ya”;
bunu link vereriken şöyle kullanacağız ;
<a href = “{{Link | sefUrl }} ” > {{Link}} </a>
Bunun html de çıktısı ise aşağıdaki gibi olacak;
<a href=”bugun-hava-ne-kadar-guzel-ya”>Bugün hava ne kadar güzel ya </a>
olacaktır.
Filterimızı oluşturmayı ve kullanmayı anlatmış olduk.
Kusurumuz varsa affola. Eksiklerimiz yada eklemek istedikleriniz varsa yada yanlış anlattığımı düşündüğünüz bir yer yorumlarda belirtebilirsiniz. Umarım faydalı olur.
muvendis 