Angular：在组件

Question

（高级警告......我对Angular很新，所以我的问题可能很天真和/或没有意义......）

我正在开发一个Angular项目（第5版），我需要将一个长字符串（一个大的XML文档 - 大约1mb）从父项传递给子组件。

执行此操作的一个选项是在子组件中使用@Input。我已经测试了这个并且它“有效”，虽然我不知道这对于这么大量的数据是否是一个“好主意”。

第二种选择是使用@ViewChild（）。如，

在parent.ts中：

// set the child component as a @ViewChild
@ViewChild(ChildChartComponent)
private childChartComponent: ChildChartComponent;

// [get the xmlString from a service]
// ... then pass it to the child ...
this.childChartComponent.loadData(xmlString);

在child.ts中：

loadData(xmlString):void {
  // receive the xmlString, parse it, then extract and display the data
}

一些笔记......

1. 正如我所提到的 - XML非常大 - 可能是1mb或更多。

2. 在父数据获取XML数据，传递给子数据，然后进行解析和处理之后，不需要“维护”它。 （即，我喜欢垃圾收集）。

3. 我真的不知道Angular是如何工作的，或实际上是将数据从父级传递给子级。但@INPUT方法使得字符串看起来像属性值：

   <child-chart [xmlString]="xmlString"></child-chart>

我怀疑Angular并不是实际上将1mb字符串写入一个属性属性，这个属性使DOM膨胀并且在现在需要它之后就坐在那里，但我真的不知道... < / p>

那么 - 要么传递非常长的字符串，要么是这些方法中的一种？或者是一种完全不同但更可取的方法吗？

Answer 1

正如你提到的那样，两种方式都可以完成工作，但角度是不可知的。我们不应该将视图（html）的角色与控制器（组件）混合在一起。我更喜欢@ViewChild（），它提供从组件到组件的直接通信，而不是通过DOM来获取更大的文件组件。您也可以直接访问该服务，除非您有理由将文件带到组件然后再转到子组件。