Как повторно использовать модели представления библиотеки, делая их наблюдаемыми в NativeScript?

Question

У меня есть общая библиотека кода TypeScript, в которой я повторно использую модели представлений (среди прочего) в веб-приложении, настольном приложении Electron, и теперь я надеюсь повторно использовать их в мобильном приложении NativeScript.

Рассмотрим следующий упрощенный пример, где я хотел бы поделиться моделью представления общего входа в систему со страницей входа моего приложения NativeScript:

Библиотеки / разделяемые Войти ракурс-model.ts

export class SharedLoginViewModel {
    username: string;
    password: string;

    logIn() {
        // do lots of stuff
    }

    forgotPassword() {
        // do more stuff
    }

    // lots of other shared stuff
    // ...
}

дом-View-model.ts

export class HomeViewModel extends SharedLoginViewModel {
    constructor() {
        super();
    }

    logIn() {
        super.logIn();
        alert('Logged In as ' + this.username + '!');
        // reset username property
        this.username = '';
    }
}

дом-page.ts

export function pageLoaded(args: EventData) {
    let page = <Page>args.object;
    page.bindingContext = new HomeViewModel();
}

домашняя page.xml

<Page loaded="pageLoaded" class="page" xmlns="http://www.nativescript.org/tns.xsd">
    <ActionBar title="Log In" class="action-bar">
    </ActionBar>

    <ScrollView>
        <StackLayout class="home-panel">
            <TextField text="{{username}}" hint="username">
            </TextField>

            <TextField text="{{password}}" hint="password">
            </TextField>

            <Button text="Submit" onTap="{{logIn}}">
            </Button>
        </StackLayout>
    </ScrollView>
</Page>

Это работает, однако, только как односторонняя привязка. Двухстороннее связывание не работает и может быть замечено при сбросе this.username = '' в функции logIn() просмотра модели.

Насколько я понимаю, NativeScript требует, чтобы модель представления была расширена Observable для уведомления об изменениях свойств для двусторонней привязки. Проблема в том, что мне уже нужно расширить класс модели общего представления, а TypeScript не поддерживает множественное наследование.

Как я могу решить эту проблему? Мне нужно, чтобы моя модель представления была наблюдаемой, но также наследовала от моего класса модели общего представления.

Здесь - игровая площадка NativeScript в приведенном выше примере.