การตัดสตริงผ่านไพพ์ใน Angular

มาเรียนรู้วิธีใช้ไพพ์ SlicePipe กัน ไพพ์นี้ช่วยให้เราตัดสตริงได้ โดย มันจะรับพารามิเตอร์ที่กำหนด ดัชนีเริ่มต้นและสิ้นสุดสำหรับการตัด เพื่อส่งผ่านพารามิเตอร์ หลังจากชื่อไพพ์ ให้ใส่เครื่องหมายทวิภาคและระบุพารามิเตอร์

มาดูตัวอย่างกัน ในคลาส คอมโพเนนต์ กำหนดคุณสมบัติ name:

export class AppComponent {
	name: string = 'john';
}

จากนั้นใช้ไพพ์ SlicePipe เพื่อตัดสตริง โดยระบุดัชนี เริ่มต้นและสิ้นสุดสำหรับมัน:

<div>
	{{ name | slice:0:2 }}
</div>

ผลลัพธ์ที่ได้จะเป็นดังนี้:

<div>
	jo
</div>

สร้างสตริงที่ประกอบด้วย 11 อักขระ แสดงบนหน้าจอเป็นช่วงจาก ดัชนี 2 ถึง 4