将AngularJS数组传递给降级的Angular 7组件

Question

我正在将AngularJS应用程序转换为Angular。我目前正在运行一个混合解决方案，其中大多数组件仍然是AngularJS组件，并且正在缓慢地将组件重写为Typescript。我正在尝试降级要在AngularJS模板中使用的Angular组件，并且该组件采用列表的@Input。

Angular控制器中的输入声明

 @Input() inputName: any;

在AngularJS模板中：

此@Input为字符串'$ ctrl.list'

<downgraded-component input-name="$ctrl.list"></downgraded-component>

@Input将会是一个空字符串

<downgraded-component input-name="{{$ctrl.list}}"></downgraded-component>

如何将列表从AngularJS组件/模板传递到Angular 7组件/模板？

Answer 1

像这样将来自表达式的数据传递到您的角度组件时，需要在括号[]中加上一个括号。

<downgraded-component [input-name]="$ctrl.list"></downgraded-component>

使用降级的组件时，您会使用新旧语法的奇怪组合-kebab案例来自angularjs，而括号则来自angular。