首页 > 解决方案 > NativeScript document.createElement 不是函数

问题描述

我正在尝试重现此 repo 中可用的高度动画:

https://github.com/alexziskind1/tnsheightanimationdemo

下面是我的组件:

import { Component } from "@angular/core";
import { Observable, Scheduler } from "rxjs";
import { Label } from 'ui/label';

import 'rxjs/observable/defer'
import 'rxjs/scheduler/animationFrame';
import 'rxjs/observable/interval'

const timeElapsed = Observable.defer(() => {
    const start = Scheduler.animationFrame.now();
    return Observable.interval(1)
        .map(() => Math.floor((Date.now() - Date.now())));
});

const duration = (totalMs) =>
    timeElapsed
        .map(elapsedMs => elapsedMs / totalMs)
        .takeWhile(t => t <= 1);

const amount = (d) => (t) => t * d;

const elasticOut = (t) =>
    Math.sin(-13.0 * (t + 1.0) *
        Math.PI / 2) *
    Math.pow(2.0, -10.0 * t) +
    1.0;

@Component({
    selector: "ns-app",
    template: `
        <StackLayout class="wrapper" (tap)="onTap($event)">
            <Label class="thelabel1" text="Hello" [height]="blah$ | async"></Label>
            <Label class="thelabel2" text="Hello" [height]="blah$ | async"></Label>
        </StackLayout>
    `,
    styles: [
        `

        `
})

    export class TestComponent {
        blah$: Observable<number> = Observable.of(25);
        onTap() {
            this.blah$ = duration(2000)
                .map(elasticOut)
                .map(amount(150));
        }
    }

执行应用程序后,我收到以下错误消息:

类型错误:document.createElement 不是函数文件:“file:///data/data/org.nativescript.PocDigitalLab/files/app/tns_modules/rxjs/util/Immediate.js,行:56,列:68。

非常感谢任何帮助。

标签: angularrxjsnativescript

解决方案


就像在这里写的问题https://github.com/NativeScript/nativescript-angular/issues/1137

试试import { Observable, Scheduler } from "rxjs";这样的改变

import { Observable} from "rxjs/Observable";
import { Scheduler } from "rxjs/Scheduler";

编辑:错误是从 rxjs 导入可能导致导入浏览器 DOM 相关的东西


推荐阅读