面试题：Angular中TypeScript如何定义组件输入属性

在Angular组件类中定义输入属性步骤如下：
- 引入必要的模块：首先需要从@angular/core模块中引入Input装饰器。在TypeScript文件顶部添加：
```
import { Component, Input } from '@angular/core';
```
- 定义组件类并使用Input装饰器：假设我们创建一个名为MyComponent的组件。
```
@Component({
  selector: 'app - my - component',
  templateUrl: './my - component.html'
})
export class MyComponent {
  // 定义输入属性
  @Input() public dataProperty: string;
}
```
- 属性类型声明：在上述例子中，dataProperty的类型声明为string。可以根据实际需求设置为任何有效的TypeScript类型，比如number，boolean，自定义的接口类型等。例如，如果接收一个数字类型的数据：
```
@Input() public numberProperty: number;
```
- 别名设置：有时候希望在组件内部使用一个名称，而在外部传递数据时使用另一个名称。可以在Input装饰器中传入别名。例如：
```
@Input('external - name') public internalName: string;
```
这样在组件外部传递数据时使用external - name，而在组件内部代码中使用internalName。

在模板中使用该组件时，可以这样传递数据：

<app - my - component [dataProperty]="'some string value'"></app - my - component>
<app - my - component [external - name]="'value for alias'"></app - my - component>

星途面试题库

面试题：Angular中TypeScript如何定义组件输入属性

知识考点

面试题答案