将变量从一个html文件传递到另一个

Question

我正在创建一个Angular 2网页-我最初有1个HTML文件，其中包含我的网页UI所需的所有内容-出于设计原因，我取出了HTML的一部分并为此创建了一个单独的组件（特别是树视图显示）。 我已经可以在原始HTML中使用其选择器tree-selector很好地引用其他HTML文件（树视图），如下所示：

<div *ngIf="showTree">
    <h1>Using treeview template.</h1>
    <tree-selector></tree-selector>
</div>

tree-selector.html的代码是（我正在使用PrimeNG UI组件）：

<p-tree [value]="fileSystemTree" selectionMode="single"  (onNodeSelect)="nodeSelect($event)" (onNodeUnselect)="nodeUnselect($event)" (onNodeExpand)="nodeExpand($event)" [style]="{'max-height':'200px','overflow':'auto'}"></p-tree>

以前，当所有内容都放在一个文件中时，很容易使用变量"fileSystemTree"来用于[value] 。 现在，我有两个HTML文件，现在不确定如何在主HTML中再次使用fileSystemTree并将其链接到tree-selector.html中的[value] 。

Answer 1

将其作为输入参数传递给<tree-selector></tree-selector> ，然后进一步传递给<p-tree...>

<div *ngIf="showTree">
    <h1>Using treeview template.</h1>
    <tree-selector [fileSystemTree]="fileSystemTree"></tree-selector>
</div>

在树选择器组件中：

@Input() fileSystemTree: any;