如何为Angular 2组件属性设置默认值
在Angular 2中,我们可以使用Input装饰器在两个组件之间(从父到子)传递一个变量的值。使用这些输入装饰器,我们也可以设置属性的默认值。下面我以一种全面的方式详细阐述了如何为Angular 2组件设置默认值。
语法:
步骤:
- 首先根据要求对.html文件进行编码。
- 然后在子组件中包含默认属性。
- 现在使用@Input()装饰器用默认值初始化该属性。
- 我们还应该从’@angular/core’导入输入装饰器。
- 一旦初始化完成,在HTML文件中使用该属性在浏览器中显示。
导入的语法:
按代码实现:
app.component.html:
app.component.ts:
child.component.ts:
child.component.html:
结论:
由于我们传递的国家属性是 “印度”,它将被显示。但是当它涉及到资本时,由于我们没有传递任何值,它在child.component.ts文件中显示默认值。
输出: