javascript - window.onload not working in angular 4 - Stack Overflow

admin管理员组

文章数量:1334887

I want to open a new window popup and as soon as the URL got load in the new popup window I want to close it.

This my ponent

import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './appponent.html',
  styleUrls: ['./appponent.css']
})
export class AppComponent implements OnInit{
  title = 'app';

  ngOnInit():void{
    var popup=window.open('','newwindow','width=300,height=200');
    popup.onload=function(){
      alert("Hello");
      window.close();
    }
  }
}

In above code

popup.onload=function(){
   alert("Hello");
   window.close();
 }

is not working, there is no alert and also window didn't got close. but if I just do

popup.alert("Hello");
popup.close(); 

It work's. But I want to close the window when the whole URL got load i.e on onload() function.

Please provide some pointer regarding this issue.

Thanks in advance!

I want to open a new window popup and as soon as the URL got load in the new popup window I want to close it.

This my ponent

import { Component, OnInit } from '@angular/core';

@Component({
  selector: 'app-root',
  templateUrl: './app.ponent.html',
  styleUrls: ['./app.ponent.css']
})
export class AppComponent implements OnInit{
  title = 'app';

  ngOnInit():void{
    var popup=window.open('https://www.w3schools.','newwindow','width=300,height=200');
    popup.onload=function(){
      alert("Hello");
      window.close();
    }
  }
}

In above code

popup.onload=function(){
   alert("Hello");
   window.close();
 }

is not working, there is no alert and also window didn't got close. but if I just do

popup.alert("Hello");
popup.close(); 

It work's. But I want to close the window when the whole URL got load i.e on onload() function.

Please provide some pointer regarding this issue.

Thanks in advance!

• javascript
• angular
• typescript

Share Improve this question Follow edited Apr 5, 2018 at 6:59 Girish Ingle asked Apr 5, 2018 at 6:11 Girish IngleGirish Ingle 13011 gold badge22 silver badges1010 bronze badges 6

• 1 If you've been "learning" from w3schools., stop now before it is too late. – Aluan Haddad Commented Apr 5, 2018 at 6:18
• I am not learing from w3schools., I was just using that URL to open new window. – Girish Ingle Commented Apr 5, 2018 at 6:22
• OK good but pick another URL. You never know when you might have a moment of weakness, none of us do :D – Aluan Haddad Commented Apr 5, 2018 at 6:22
• sure :D @AluanHaddad – Girish Ingle Commented Apr 5, 2018 at 6:26
• Possible duplicate of how to write Onload function using angular 4? – Harry B Commented Apr 5, 2018 at 6:46

 |  Show 1 more ment

3 Answers 3

Sorted by: Reset to default 2

Why you are using onLoad if you can You use ngAfterViewInit(). "Respond after Angular initializes the ponent's views and child views / the view that a directive is in."

popup: any;
ngOnInit():void{
this.popup=window.open('https://www.w3schools.','newwindow','width=300,height=200');
}
ngAfterViewInit() {
this.popup.close();
}

import ngAfterViewInit and try if this works for you.

angular 2 app run on the different environment like web, mobile, server-side rendering so windows object may or may not be available there. so it's not the best approach to use windows object directly instead make service which returns windows object and simply substitute the service implementation according to the environment

@Injectable()
export class WindowRef {
    constructor() {}

    getNativeWindow() {
        return window;
    }
}

The problem is you used "alert("Hello"); " and did not reference the popup. It should be

popup.onload=function(){
  alert("Hello");
  window.close();
}

本文标签： javascriptwindowonload not working in angular 4Stack Overflow