本机脚本将参数传递给嵌套组件

Question

我正在用angular 5和Nativescript做一个应用程序。好吧，在应用程序中，我有不同的页面(组件(，并且它们都具有相同的底部菜单，即单个组件。我的问题是如何将参数传递给菜单组件，因为在菜单组件上我需要知道 witch 是当前页面，例如用于将活动类设置为菜单的当前页面项。

单页示例：

<Page>
<ActionBar title="" class="action-bar">
<StackPanel orientation="horitzontal">
<Label class="action-title" text="Canciones"></Label>
</StackPanel>
</ActionBar>
<StackLayout class="page">
<ListView [items]="filteredSongs" class="songs-listview" (itemTap)="songClick($event)" *ngIf="!isLoading">
<ng-template let-item="item">
<StackLayout>
<Label [text]='item.SON_NAME'></Label>
</StackLayout>
</ng-template>
</ListView>
<StackLayout verticalAlignment="center" *ngIf="isLoading" class="loading-stack">
<ActivityIndicator busy="{{ isLoading }}"></ActivityIndicator>
</StackLayout>
</StackLayout>
<main-menu></main-menu> // THE MENU COMPONENT

Answer 1

如果我理解正确，您的页面组件是父级，主菜单是子级。需要使用输入绑定。

1(将主菜单标签更改为类似<main-menu [currentPage]="Canciones"></main-menu>。这将向主菜单组件发送一个输入，名称为 currentPage，值为 Canciones。

2(接下来，您需要更改主菜单组件以使用我们刚刚绑定的输入。

a( 添加import { Input } from '@angular/core';

b( 在组件类中，声明 输入：@Input() currentPage: string;

c( 根据需要使用 currentPage 变量。

掌握输入绑定的基础知识后，可以更改输入类型，并更通用地绑定对当前页面组件的引用。

大卫