Angular 7 - PDF file not opening

127 Views Asked by At

I am using Angular 7 for front end application and CakePHP for backend. On click of a button, a pdf file should open in the new tab. When I am trying to open it, instead of opening pdf file(url:"http://localhost/api/report/1234.pdf"), it is throwing error message - "Missing controller". It seems browser is unable to detect pdf file

Please find the package.json file below

{

"name": "xyz", "version": "0.0.0", "scripts": { "ng": "ng", "start": "ng serve", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e" }, "private": true, "dependencies": { "@angular/animations": "^7.2.16", "@angular/cdk": "~7.3.7", "@angular/common": "~7.2.0", "@angular/compiler": "~7.2.0", "@angular/core": "~7.2.0", "@angular/forms": "~7.2.0", "@angular/material": "^7.3.7", "@angular/platform-browser": "~7.2.0", "@angular/platform-browser-dynamic": "~7.2.0", "@angular/router": "~7.2.0", "@cds/core": "^5.6.4", "@ckeditor/ckeditor5-angular": "^1.1.0", "@ckeditor/ckeditor5-build-classic": "^12.4.0", "@clr/angular": "^1.1.2", "@clr/icons": "^1.1.2", "@clr/ui": "^1.1.2", "@fullcalendar/angular": "^4.2.1", "@fullcalendar/core": "^4.2.0", "@fullcalendar/daygrid": "^4.2.0", "@fullcalendar/interaction": "^4.2.0", "@fullcalendar/resource-timegrid": "^4.2.0", "@fullcalendar/timegrid": "^4.2.0", "@ng-select/ng-select": "^2.20.5", "@webcomponents/webcomponentsjs": "^2.6.0", "angular-ng-autocomplete": "^1.1.14", "blueimp-canvas-to-blob": "^3.17.0", "core-js": "^2.5.4", "file-saver": "^2.0.2", "hammerjs": "^2.0.8", "log4js": "^6.3.0", "ng-http-loader": "^5.1.0", "ng-multiselect-dropdown": "^0.2.4", "ng2-image-compress": "^7.0.7", "ng2-img-max": "^2.1.18", "ng2-pdf-viewer": "~6.4.1", "ngx-filter-pipe": "^2.1.2", "ngx-pagination": "^4.1.0", "ngx-select-ex": "^7.0.1", "ngx-toastr": "^10.2.0", "rxjs": "~6.3.3", "rxjs-compat": "^6.4.0", "tslib": "^1.9.0", "zone.js": "~0.8.26" }, "devDependencies": { "@angular-devkit/build-angular": "~0.13.0", "@angular/cli": "~7.3.8", "@angular/compiler-cli": "~7.2.0", "@angular/language-service": "~7.2.0", "@types/jasmine": "~2.8.8", "@types/jasminewd2": "~2.0.3", "@types/node": "~8.9.4", "codelyzer": "~4.5.0", "jasmine-core": "~2.99.1", "jasmine-spec-reporter": "~4.2.1", "karma": "~4.0.0", "karma-chrome-launcher": "~2.2.0", "karma-coverage-istanbul-reporter": "~2.0.1", "karma-jasmine": "~1.1.2", "karma-jasmine-html-reporter": "^0.2.2", "node-sass": "^7.0.1", "protractor": "~5.4.0", "ts-node": "~7.0.0", "tslint": "~5.11.0", "typescript": "~3.2.2", "webpack": "^4.29.0" } }

0

There are 0 best solutions below