ASP.NET MVC Razor Systax

Posted: กรกฎาคม 16, 2011 in asp.net
ป้ายกำกับ:, , , , ,

บทความนี้เป็นการแนะนำเบื่องต้นเกี่ยวกับ syntax ของ Razor

ผมได้แปล สรุป และเรียบเรียงจาก ที่นี่ 

รายละเอียดดังนี้

 

1.จะเพิ่ม code ลงเพจต้องนำหน้าด้วยอักษร @

image

.การเขียนแบบบล็อค เขียนในปีกกา

 

image

2. การเขียนแบบนี้เป็นแบบหลายประโยค ภายในปีกกา

 

image

แบบนี้เขียนร่วมกับแท็ก html

 

3. ภายในบล็อคโค้ดจะต้องปิดท้ายประโยคด้วย ;

 

4.ตัวแปร ประกาศด้วย var นำหน้าชื่อตัวแปร แล้วนำไปใช้ในประโยคต่อไป

image

 

เมื่อรันจะได้ผลดังนี้

image

 

5. กำหนดค่าแบบ string ให้ตัวแปร

ต้องใส่ “…” ครอบข้อความก่อนส่งค่าให้ตัวแปร (แถวนี้เรียกฟันหนู)

image

 

หากต้องการแสดงหรือใช้งานอักษรพิเศษเช่น \ หรือ  “ หรืออื่นๆ ต้องใช้ @นำหน้า

 

image

ภาพนี้แสดงตัวอย่างการใช้ \ ภายในตัวแปรแล้วนำไปแสดงผล

 

image

ภาพนี้เป็นการใช้ “ ภายในตัวแปร

 

เมื่อรันจะได้ผลดังนี้

image

 

6. ตัวแปรเป็นแบบ case sensitive คืออักษรเล็กใหญ่มีผลต่างกันเช่น

image

แม้ว่าชื่อตัวแปรเหมือนกัน แต่ถือว่าเป็นคนละตัวกัน เพราะพิมพ์ไม่เหมือนกัน

 

7.เขียนลักษณะ object ได้

ลักษณะคล้ายกับการเรียกใช้ object และ method สมัยที่ยังใช้ asp classic หากเกิดทันเช่น

image

 

และผลที่ได้คือ

image

 

8.สร้างเงื่อนไขได้

เราสร้างโค้ดที่ใช้ตัดสินใจเช่น if-else ได้

image

จากตัวอย่าง เมื่อปุ่ม submit ถูกกด

จะถูกนำไปตรวจสอบว่ามีการ post กลับมาหรือไม่

หากใช่จะแสดงข้อความผ่านตัวแปร result ว่าเพจนี้มาจากการกด submit

 

9.การใส่หมายเหตุ

image

 

image

อันนี้เป็นการใส่แบบภาษา c#

 

10.ตัวแปรและประเภทข้อมูล

สามารถประกาศตัวแปรแบบไม่ระบุประเภทข้อมูลได้ด้วยใช้ var นำหน้า

หรือจะระบุประเภทตัวแปรเลยก็ได้

image

 

ตารางการแปลงค่า

image

 

การดำเนินการ

 

การ + – * / ปกติ

image

 

การกำหนดค่าให้ตัวแปร

image

 

การเปรียบเทียบ

 

 

เท่ากันหรือไม่ ?image

 

ไม่เท่ากันใช่ใหม ?

image

 

มากกว่า น้อยกว่า มากกว่าหรือเท่ากับหรือไม่

image

 

การเขียน + – แบบย่อ

image

 

การเรียกใช้ method ของ object

image

 

จัดกลุ่มหรือส่งค่าไปยังพารามิเตอร์ของเมธอด

image

 

เข้าถึงลำดับของตัวแปร

image

 

reverse หรือ not แปลงค่าให้ตรงข้าม

image

 

การเปรียบเทียงและ / หรือ

image

 

การเข้าถึง root เสมือน

ใช้ ~ ผมเรียกว่าตัวหนอน ฝรั่งเรียกว่าทิลด้า

image

 

การแปลง Root เสมือนเป็น path บนไดรว

ใช้คำสั่ง server.Mappath จะแสดงพาธออกมาเป็นตำแหน่งใน hdd

image

 

เงื่อนไข

If –else

 

image

 

แบบ switch case

image

 

 

วนรอบการทำงาน

แบบ For

image

 

แบบ Foreach จะวนรอบทำงานจนกว่าหมด Collection

image

 

แบบตรวจสอบเงื่อนก่อนวนลูปด้วย while

image

 

การตรวจจับข้อผิดพลาด ด้วย Try-Catch

 

image

 

จบแล้วคับ

ความเห็น
  1. craftkung พูดว่า:

    ออกแนว PHP เลยครับเขียนผสมกับ HTML ได้ อย่างนี้มันจะทำให้ไล่ code ยากหรือเปล่าครับ เหมือนกับว่าถอยหลังอย่างไงไม่รู้ เพราะหลายๆ frame work พยายามจะเอา code program แยกออกจาก HTML แต่อันนี้เอา code กลับมารวมกับ HTML อีกแล้ว แต่ MS คงคิดดีแล้วแหละเนอะ ว่าแต่ Syntax เหมือน C# มากๆ

  2. ICT BB Admin พูดว่า:

    เท่าที่ผมลองเล่นดู (ไม่ได้ใช้งานจริง) โค้ดไล่ไม่ยากครับ
    เพราะ VS มันช่วยดีบักให้เราอยู่แล้ว

    ประเด็นถอยหลังนี่ ผมคิดว่าเค้าคงเอาใจนักพัฒนาเว็บแบบ Script
    ซึ่งง่ายและตรงประเด็น จาก ปสก ส่วนตัว
    mvc คล้ายๆกับ กลับไปเขียน asp ที่ up ขึ้นมาหน่อยนึง

    หามีอะไรแลกเปลี่ยนสามารถแนะนำผมได้นะครับ ขอบคุณมากครับที่มาเยี่ยมเยียน 🙂

  3. ICT BB Admin พูดว่า:

    ลืมอีกอย่างคับ mvc + vb ก็มีนะคับลองศึกษาจาก
    asp.net/mvc ดูนะ

  4. say พูดว่า:

    เอาบทความลงเยอะๆน่ะครับ ^^ มีประโยชน์มาก

  5. ICT BB Admin พูดว่า:

    ขอบคุณคับ มีอะไรแลกเปลี่ยนได้นะคับ

  6. kit พูดว่า:

    ขอบคุณครับ สนใจด้านนี้พอดี เรียบเรียงสรุป เข้าใจง่ายมาก วันเดียว ผมเขียน razor ได้แล้ว

ใส่ความเห็น