ค้นหาเว็บไซต์

angular - ทำไมเราจึงใช้ "PipeTransform" ในท่อกำหนดเอง?


นี่คือท่อที่ฉันออกแบบเอง:

import { Pipe, PipeTransform } from '@angular/core';

@Pipe({
  name: 'dc'
})
export class DcPipe implements PipeTransform {
  transform(value: any, args?: any): any {
    if (!value) return value;

    return value.replace(/\w\S*/g, function(txt) {
      return txt.charAt(0).toLowerCase() + txt.substr(1).toUpperCase();
    });
  }
}

วัตถุประสงค์ของการใช้ implements PipeTransform ในการประกาศคลาสคืออะไร?

จากที่ฉันเห็น มันยังทำงานได้แม้ไม่มีส่วนนี้

คำตอบ #1

PipeTransform เป็นอินเทอร์เฟซ: https://angular.io/api/core/PipeTransform

การรวมเอาไว้และการใช้ implements PipeTransform จะทำให้คลาสของคุณสามารถใช้งานเมธอด transform ที่จำเป็นได้ และเป็นไปตามอินเทอร์เฟซของมัน (โดยเฉพาะการกำหนดพารามิเตอร์ value ตัวแรก ... มันไม่ได้ทำอะไรเพิ่มเติมมากนัก)

การปฏิบัติตามอินเทอร์เฟซช่วยจับข้อผิดพลาดที่อาจเกิดขึ้นระหว่างรันไทม์ (ในช่วงเวลาการแปลงโค้ด) รวมถึงแต่ไม่จำกัดเพียง:

  • ไม่ทำการใช้งาน transform เลย
  • ไม่ได้ส่งค่ากลับจาก transform

นี่คล้ายกับ implements OnInit/ngOnInit คุณไม่จำเป็นต้อง ทำการ implement มันเพื่อให้โค้ดทำงานได้ แต่ก็เป็นแนวปฏิบัติที่ดี

คำตอบ #2

นี่คือนิยามของ API: https://angular.io/api/core/PipeTransform

ลิงก์ไปยังโค้ดเบื้องหลัง: https://github.com/angular/angular/blob/5.1.3/packages/core/src/change_detection/pipe_transform.ts#L1-L38

PipeTransform เป็นอินเทอร์เฟซที่เรียบง่าย มันอธิบายสิ่งที่ควรคาดหวังจากการนำไปใช้ ไม่ใช่สิ่งอื่นใด

บทความที่เกี่ยวข้อง