Question

我需要使用绑定将值数组传递给组件，例如

@Component({
    selector: 'my-component',
    template: '<div data="[1, 2, 'test']"></div>
})
export class MyComponent {
    @Input() data: any[];
    ...
}

然而，似乎Angular将其视为string / string[1]（在实际项目中，数组是一个路由，我需要将此路由传递给具有{{1}的组件指令）。

我该怎么做？

Answer 1

你需要用[]包装属性，否则它根本不会被Angular处理：

[data]="[1, 2, 'test']"

您的示例似乎是从组件内部设置data。这不是具有约束力的方式。您可以使用<my-component [data]="[1, 2, 'test']"></my-component>将组件从外部传递到组件。

Answer 2

所以让我们从这里开始......在 Angular 2 + 中，如果它们没有得到括号，那么所有输入都会向下传递一个字符串......

所以有两种方法可以传递你的价值......

如果您这样写：http://localhost:<port>

你基本上把它称为“[1,2，'test']”（作为字符串）......

你做的方式是传递字符串的好方法，你也可以使用插值并将其与javascript混合然后传递下来，如'Angular {{version}}'

因此，要将其作为数组或任何javascript无效值传递下去，您需要在输入中使用'<div data="[1, 2, 'test']"'，就像这样......

[]

Answer 3

通常，只有在组件嵌套在另一个组件中时才使用输入。

所以在另一个组件中，例如：<my-component [data]= ...>

如何从组件模板中将数组作为Input（）传递？

3 个答案: