I\'m trying to insert a web-view on my page and listen the \'loadFinishedEvent\'... But for do this, i need to find the webview in my component
Have you tried to use the eventargs on load with the method getViewById to find a control. You can find more information here - https://docs.nativescript.org/ui/ui-with-xml
Good link for documentation for using WebView Nativescript/Android
html:
<WebView #webview [src]="url"></WebView>
backend code:
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");
});
}
}
Note: that it seems that WebView needs to sized with width/height attributes are in a GridView, see the docs reference above. It won't dynamically grow based on content.
I solved it with the following code:
<WebView [src]="url" (loadFinished)="loadFinished($event)"></WebView>
Important: remove the <Page>
tag (should not be used within Nativescript/Angular 2).
More info: github issue
Your .ts file containing class implementation
import { Component } from "@angular/core";
@Component({
selector: "Date",
templateUrl: "myPage.html", //here is your reference to html page
})
export class Angular2WebView {
//any class function
}
Your html file myPage.html
<GridLayout>
<WebView id="webView" url="http://www.google.com" >
</WebView>
</GridLayout>
for more info. refer here Nativescript bare webview doesnt seem to work