如何将对象属性绑定到页面路由器出口的name属性？

Question

我选择不对选项卡进行硬编码。我希望它们具有动态性，因此我使用了ngFor并可以显示选项卡的标题和图标。由于某些原因，选项卡名称不能与name属性一起使用。

---

因此选项卡类具有标题，图标和名称属性。

tab.name返回homeTab，browseTab或searchTab。

注释掉的代码100％有效。我想工作的代码除了路由部分外，其他所有功能都可以。

---

<TabView androidTabsPosition="bottom">

    <ng-container *ngFor="let tab of tabs">

        <page-router-outlet *tabItem="{title: tab.title, iconSource: getIconSource(tab.icon)}" name="tab.name">

        </page-router-outlet>

    </ng-container>

<!-- 
    <page-router-outlet *tabItem="{title: 'Home', iconSource: getIconSource('home')}" name="homeTab">
    </page-router-outlet>

    <page-router-outlet *tabItem="{title: 'Browse', iconSource: getIconSource('browse')}" name="browseTab">
    </page-router-outlet>

    <page-router-outlet *tabItem="{title: 'Search', iconSource: getIconSource('search')}" name="searchTab">
    </page-router-outlet>
-->

</TabView>