Angular2:EXCEPTION:未捕获(承诺):错误:无法匹配任何路由

时间:2016-11-08 20:04:00

标签: angular typescript components embed

我开始在Angular 2中开发,无法理解发生了什么以及如何解决我的问题。我得到下一个错误:

error_handler.js:47 EXCEPTION: Uncaught (in promise): Error: Cannot match any routes. URL Segment: 'public/pdf/null.pdf'
Error: Cannot match any routes. URL Segment: 'public/pdf/null.pdf'
    at ApplyRedirects.noMatchError (http://localhost:4200/main.bundle.js:59583:16)
    at CatchSubscriber.selector (http://localhost:4200/main.bundle.js:59561:29)
    at CatchSubscriber.error (http://localhost:4200/main.bundle.js:47079:31)
    at MapSubscriber.Subscriber._error (http://localhost:4200/main.bundle.js:4544:26)
    at MapSubscriber.Subscriber.error (http://localhost:4200/main.bundle.js:4518:18)
    at MapSubscriber.Subscriber._error (http://localhost:4200/main.bundle.js:4544:26)
    at MapSubscriber.Subscriber.error (http://localhost:4200/main.bundle.js:4518:18)
    at MapSubscriber.Subscriber._error (http://localhost:4200/main.bundle.js:4544:26)
    at MapSubscriber.Subscriber.error (http://localhost:4200/main.bundle.js:4518:18)
    at LastSubscriber.Subscriber._error (http://localhost:4200/main.bundle.js:4544:26)

我的方案包括我有一个文档列表,一些文档是图像和其他PDF,当我点击PDF文档时,它必须显示PDF查看器及其组件中的文件。我发送文件的ID认为是路由器的URL所以我抓住组件并通过http获取服务获取整个对象。我得到的数据没有问题但是当我尝试嵌入PDF查看器时,我得到EXEPTION数据null

这是我的PDF组件:

import { Component, OnInit } from '@angular/core';
import {ActivatedRoute} from "@angular/router";
import {DomSanitizer} from '@angular/platform-browser';

import { Doc } from "../../../interfaces/docs";
import { DocService } from "../../../services/documento.service";


@Component({
  selector: 'app-pdf',
  templateUrl: './pdf.component.html',
  styleUrls: ['./pdf.component.css'],
  providers:  [DocService]
})
export class PdfComponent implements OnInit {

public id  : any;
public doc : Doc;
public url : string;
public pdfUrl: any;
constructor(private route: ActivatedRoute, private _httpService: DocService, private sanitizer: DomSanitizer)  {
  this.id = route.snapshot.params['id']
}
ngOnInit()  {
  this.doc  = {
    reg: null,
    key:    null,
    name:   null,
    date:    null,
    file:  null,
    type:     null
  };


  this._httpService.searchDoc(this.id)
    .subscribe(
      data  =>  {this.doc= data, console.log(JSON.stringify(data))},
      error =>  alert(error + ' Error GET')
    )

    this.url = '/public/pdf/'+this.doc.file+'.pdf',
    console.log("url "+ this.url),
    this.pdfUrl = this.sanitizer.bypassSecurityTrustResourceUrl(this.url);

    console.log("url " +this.url)

}

}

这是我的PDF组件

中的HTML
<section>
  <embed  class="center-block" [src]="pdfUrl" width="80%" type='application/pdf'>
  <iframe [src]="pdfUrl" width="500" height="600" type='application/pdf'></iframe>
</section>

注意:我有embediframe只是为了测试它是否是我试图测试的标签

我会感激任何帮助

提前谢谢

乔治

0 个答案:

没有答案