Question

在Nativescript移动应用程序中包含NPM插件可能更为通用，但我将使用此特定插件作为示例。我已经完成了从Nativescript网站添加第三方插件的文档，但我仍然无法使用Angular 2和Nativescript将此插件与我的移动应用程序配合使用。

我使用以下方法安装了插件：

tns plugin add nativescript-videoplayer

这是我的组件：

import { Component, ElementRef, ViewChild } from "@angular/core";
import { Video } from 'nativescript-videoplayer';


@Component({
    selector: "grandhall",
    templateUrl: "pages/grandhall/grandhall.html",
    styleUrls: ["pages/grandhall/grandhall-common.css", "pages/grandhall/grandhall.css"]
})

export class GrandHallComponent {

}

这是我的模板：

<StackLayout>
    <Label text="Grand Hall"></Label>
    <VideoPlayer:Video id="nativeVideoPlayer" controls="true" autoplay="true" height="280" src="https://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4" />
</StackLayout>

这是我在移动应用程序中显示视频时需要做的插件文档，但视频未在页面上显示。我也在iPhone 6 Plus的实际设备上测试，而不是在模拟器中测试。

我猜我需要做一些不同的事情才能在我的Angular 2模板中包含插件中的View。请帮忙。

Answer 1

您需要像这样致电registerElement：

// somewhere at top of your component or bootstrap file import {registerElement} from "nativescript-angular/element-registry"; registerElement("VideoPlayer", () => require("nativescript-videoplayer").Video);

然后它可以在您的UI和NativeScript Angular文档中使用：https://docs.nativescript.org/angular/plugins/angular-third-party.html#simple-elements

Angular 2中的Nativescript-VideoPlayer

1 个答案: