Warning: file_get_contents(/data/phpspider/zhask/data//catemap/8/http/4.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
如何通过Angular4下载网页?_Angular_Http_Jsonp - Fatal编程技术网

如何通过Angular4下载网页?

如何通过Angular4下载网页?,angular,http,jsonp,Angular,Http,Jsonp,我想通过Angular 4下载一个页面。 实际上,我想获得YouTube视频的下载链接。 我的代码如下: import { Component } from '@angular/core'; import { NgForm } from '@angular/forms'; import { Jsonp, Http, Response } from '@angular/http'; import { Headers, RequestOptions } from '@angular/http';

我想通过Angular 4下载一个页面。
实际上,我想获得YouTube视频的下载链接。
我的代码如下:

import { Component } from '@angular/core';
import { NgForm } from '@angular/forms';
import { Jsonp, Http, Response } from '@angular/http';
import { Headers, RequestOptions } from '@angular/http';

import { Observable } from 'rxjs/Observable';
import 'rxjs/add/operator/catch';
import 'rxjs/add/operator/map';

@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent {
  title = 'Youtube Direct';
  youtubeLink = 'https://www.youtube.com/watch?v=wBBzD_pDags&list=PL3ewn8T-zRWgWGtHzwrvO2ZdCExU7wk8M';
  youtubePageHtml: string;

  constructor(private jsonp: Jsonp, private http: Http) { }

  GetButtonOnClick(): void {
    this.jsonp.get(this.youtubeLink)
      .map(this.extractData)
      .catch(this.handleError);      
  }

  private extractData(res: Response) {
    console.log(res);
    let body = res.json();
    return body.data || {};
  }

  private handleError(error: Response | any) {
    let errMsg: string;
    if (error instanceof Response) {
      const body = error.json() || '';
      const err = body.error || JSON.stringify(body);
      errMsg = `${error.status} - ${error.statusText || ''} ${err}`;
    } else {
      errMsg = error.message ? error.message : error.toString();
    }
    console.error(errMsg);
    return Observable.throw(errMsg);
  }


}
但是
extractData
从不调用。

如何通过Angular 4下载页面?

这是因为您需要订阅返回的可观察内容

试试这个:

  GetButtonOnClick(): void {
    this.jsonp.get(this.youtubeLink)
      .map(this.extractData)
      .subscribe(
        (res: any) => this.youtubePageHtml = res,
        (err: Error) => this.handleError,
        () => console.log('OnComplete !')
      )
  }
如果您想了解更多信息:
-

-这是因为您需要订阅返回的可观察数据

试试这个:

  GetButtonOnClick(): void {
    this.jsonp.get(this.youtubeLink)
      .map(this.extractData)
      .subscribe(
        (res: any) => this.youtubePageHtml = res,
        (err: Error) => this.handleError,
        () => console.log('OnComplete !')
      )
  }
如果您想了解更多信息:
-
-