Angular开发人员一直在因为Setters和Getters而感到头疼，特别是在应对维护性差的代码时。然而，Angular团队一直在开发新特性，以简化我们繁琐的工作，这让我们的生活变得更加轻松和愉快。
现在，Angular的转换选项为我们提供了一个方便快捷的方法，在不使用Setters和Getters的情况下，将输入属性映射到组件属性。这是一个功能强大的功能，有助于减少代码量并提高效率。
这个新特性允许我们使用一个函数，即输入属性的值，并返回我们希望为组件属性使用的值。调用此函数的结果将自动分配给组件属性，从而省略了冗长的Setters和Getters。
下面给出了一个示例：
@Component({
selector: ‘app-root’,
template: `
{{ name }}
`,
})
export class AppComponent {
@Input() firstName = ”;
@Input() lastName = ”;
name = ”;
ngOnInit() {
this.name =
`${this.transform(this.firstName)} ${this.transform(this.lastName)}`;
}
transform(value: string): string {
return value.toUpperCase();
}
}
在上面的代码中，我们使用@Input装饰器定义了两个输入属性：firstName 和 lastName。我们使用了一个名为transform的函数，该函数将输入属性值转换为大写的格式，并将它们添加在一起以形成名字。
在 ngOnInit钩子函数中，我们调用了transform函数两次，使用它们的结果创建了我们需要的名字。我们不再需要为每个输入属性编写繁琐的setter和getter。
转换选项功能使我们能够使用自由函数对输入属性进行处理，从而使我们的代码更加简洁、易于维护和灵活性更高。
要使用转换选项，只需处理器函数作为输入绑定的值，即可自动将其结果分配给组件的属性。这使我们能够轻松地对输入属性进行转换和验证。
总之，Angular的转换选项为我们提供了一个快捷、简单的方法来处理输入属性。这个新特性有助于简化我们代码，提高我们的效率，扩展我们的工具箱，加强我们的开发能力。让我们拥抱这个新的特性，并享受更高效的开发体验。
了解更多有趣的事情：https://blog.ds3783.com/