Question

我试图在我的网页上插入网络视图，然后收听＆＃39; loadFinishedEvent＆＃39; ... 但是为了做到这一点，我需要在我的组件（ts文件）中找到webview，通过nativescript方式我需要用标签包装我的xml（UI）：

<Page xmlns="http://schemas.nativescript.org/tns.xsd

但是这样做我得到了这个错误：＆＃34; TypeError：this.page.frame._getNavBarVisible不是一个函数＆＃34;，如果没有Page标签，我已经尝试了一些方法，但是没有成功...

我也没有发现任何这样的样本，任何人都可以帮助我吗？

Answer 1

包含类实现的.ts文件

import { Component } from "@angular/core";

@Component({
selector: "Date",
templateUrl: "myPage.html", //here is your reference to html page
})

export class Angular2WebView {
//any class function
}

你的html文件myPage.html

<GridLayout>
    <WebView id="webView" url="http://www.google.com" >
    </WebView>
</GridLayout>

了解更多信息。请参阅此处Nativescript bare webview doesnt seem to work

Answer 2

使用WebView Nativescript/Android

的文档的良好链接

HTML：

 <WebView #webview [src]="url"></WebView>

后端代码：

import {Component, OnInit} from "@angular/core";
import {WebView, LoadEventData} from "ui/web-view";

@Component({
    selector: 'basic-web-view-component',
    templateUrl: //see html above
})

export class BasicWebViewComponent implements OnInit {

    public url="https://www.google.com";
    @ViewChild("webview") webview: WebView;

    ngOnInit() {

        this.webview.on(WebView.loadFinishedEvent, function (args: LoadEventData) {
             console.log("loadFinishedEvent called");
        });
    }
}

注意：似乎WebView需要使用width / height属性进行大小调整，请参阅上面的文档参考。它不会根据内容动态增长。

Answer 3

我用以下代码解决了它：

<WebView [src]="url" (loadFinished)="loadFinished($event)"></WebView>

重要提示：删除<Page>标记（不应在Nativescript / Angular 2中使用）。

更多信息：github issue

Answer 4

您是否尝试使用方法getViewById在加载时使用eventargs来查找控件。您可以在此处找到更多信息 - https://docs.nativescript.org/ui/ui-with-xml

如何在angular2中使用nativescript的WebView？

4 个答案: