Question

有没有办法在我的app-component中监听标签更改？

//app.component.ts

import {Component, ElementRef} from '@angular/core';

    @Component({
        selector: 'app-component',
        templateUrl: 'app.component.html' 
    })
    export class AppComponent {

         //this isn't working
         onSelectedIndexChanged(args) {
           console.log("changing");
       }

    }

Answer 1

要处理TabView索引更改，您可以使用selecedIndexChangeEvent。例如：

app.component.html

<TabView #tabView (selectedIndexChanged)="tabViewIndexChange( tabView.selectedIndex)" class="example-container">
<StackLayout *tabItem="{title: 'Profile', iconSource: '~/icon.png'}" >
        <ListView [items]='items'>
            <template let-item='item'>
                <Label [text]='item.itemDesc' ></Label>
            </template>
        </ListView>
    </StackLayout>
    <StackLayout *tabItem="{title: 'Stats'}">
        <Label text="Second tab item"></Label>
    </StackLayout>
    <StackLayout *tabItem="{title: 'Settings'}">
        <Label text="Third tab item"></Label>
    </StackLayout>
</TabView>

app.component.ts

public tabViewIndexChange(result){
       alert("Tab View selected index: "+result);
   }

要获得进一步的帮助，您可以查看示例应用here

如何获取制表符更改事件nativescript

1 个答案: