Question

我试图让我的孩子组件读取父母HTML的ngfor值以显示孩子页面。但是子组件似乎没有从父页面获取索引号。

这是我的父母：app.component.html：

import random

intelligence_levels = list(range(1,16,1)) # function range params are start, stop , step where stop number does not included in the list

player_int = random.choice(intelligence_levels)

randomized = []

randomized.append(player_int)

这是孩子：Columns.component.ts

var feetMark = prompt('How tall is mark in feet?');
var lbsMark = prompt('How much does mark weigh in pounds?');


feetMark = parseFloat(feetMark);
lbsMark = parseFloat(lbsMark);

var kgMark = lbsMark / 2.2046;
var meterMark = feetMark / 3.2808;
var bmiMark = kgMark / (meterMark * meterMark);

alert('Mark is ' + ' ' + kgMark + ' '+ 'kilograms');
alert('Mark is ' + ' ' + meterMark + ' ' + 'meters');
alert('Marks BMI is ' + ' ' + bmiMark);

indexnumber的值始终是不确定的。我想知道如何使Columns.component.ts中的索引号获得ngfor'i'值？

Answer 1

首先，数组的索引是数字，而不是字符串。所以

@Input() public indexnumber: string;

应该是

@Input() public indexnumber: number;

第二个：为了使angular能够设置组件的索引号，您的组件需要存在。因此，必须在之前构建它。因此，在调用构造函数时，可能尚未设置输入。因此，尝试访问构造函数中输入的值可能无法为您提供父级传递的值。

使用ngOnInit或ngOnChanges。这是首次设置/更改输入时调用的方法。

无法将ngfor索引从HTML发送到子组件

1 个答案: