Renderer error with angular 9

uplink42 commented 4 years ago

After updating to angular V9, the Renderer class was removed, so there's a few errors being thrown:

ERROR in node_modules/ngx-gallery/ngx-gallery-helper.service.d.ts:1:22 - error TS2724: Module '"C:/Users/Documents/repos/real-estate-client/node_modules/@angular/core/core"' has no exported member 'Renderer'. Did you mean 'Renderer2'?

1 import { ElementRef, Renderer } from '@angular/core';
                       ~~~~~~~~

  node_modules/@angular/core/core.d.ts:5680:31
    5680 export declare abstract class Renderer2 {
                                       ~~~~~~~~~
    'Renderer2' is declared here.
node_modules/ngx-gallery/ngx-gallery-preview.component.d.ts:1:89 - error TS2724: Module '"C:/Users/Documents/repos/real-estate-client/node_modules/@angular/core/core"' has no exported member 'Renderer'. Did you mean 'Renderer2'?

1 import { ChangeDetectorRef, EventEmitter, OnInit, OnChanges, SimpleChanges, ElementRef, Renderer } from '@angular/core';
                                                                                          ~~~~~~~~

  node_modules/@angular/core/core.d.ts:5680:31
    5680 export declare abstract class Renderer2 {
                                       ~~~~~~~~~
    'Renderer2' is declared here.

nelsonkuria commented 4 years ago

I updated all references to the deprecated Renderer service to Renderer2 inside ngx-gallery-helper.service.d.ts and ngx-gallery-preview.component.d.ts but then I got the error:

Uncaught Error: Can't resolve all parameters for NgxGalleryPreviewComponent: ([object Object], [object Object], [object Object], ?, [object Object]). at syntaxError (compiler.js:2281) at CompileMetadataResolver._getDependenciesMetadata (compiler.js:21063) at CompileMetadataResolver._getTypeMetadata (compiler.js:20958) at CompileMetadataResolver.getNonNormalizedDirectiveMetadata (compiler.js:20573) at CompileMetadataResolver.loadDirectiveMetadata (compiler.js:20437) at compiler.js:26467 at Array.forEach (<anonymous>) at compiler.js:26466 at Array.forEach (<anonymous>) at JitCompiler._loadModules (compiler.js:26463)

https://stackoverflow.com/questions/60126992/cant-resolve-all-parameters-for-ngxgallerypreviewcomponent-after-ng-serve?noredirect=1#comment106345690_60126992

resuta566 commented 4 years ago

I updated all references to the deprecated Renderer service to Renderer2 inside ngx-gallery-helper.service.d.ts and ngx-gallery-preview.component.d.ts but then I got the error:

Uncaught Error: Can't resolve all parameters for NgxGalleryPreviewComponent: ([object Object], [object Object], [object Object], ?, [object Object]). at syntaxError (compiler.js:2281) at CompileMetadataResolver._getDependenciesMetadata (compiler.js:21063) at CompileMetadataResolver._getTypeMetadata (compiler.js:20958) at CompileMetadataResolver.getNonNormalizedDirectiveMetadata (compiler.js:20573) at CompileMetadataResolver.loadDirectiveMetadata (compiler.js:20437) at compiler.js:26467 at Array.forEach (<anonymous>) at compiler.js:26466 at Array.forEach (<anonymous>) at JitCompiler._loadModules (compiler.js:26463)

https://stackoverflow.com/questions/60126992/cant-resolve-all-parameters-for-ngxgallerypreviewcomponent-after-ng-serve?noredirect=1#comment106345690_60126992

we just have to wait for the author to update his repo.. I also got this error when I change to Rendere2

kolkov commented 4 years ago

https://github.com/kolkov/ngx-gallery try this full compatible Angular 8, 9 version please.

webtrainer-in commented 4 years ago

dear kolkov, thanks for sharing this , could you please suggest what is to be changed if we want to keep existing library only

kolkov commented 4 years ago

@webtrainer-in my library is 100% compatible by API. You only need to install new lib and change import paths. If you have any problem, create an issue in my repo. Or if you want to save this original lib, copy this lib source code to your project, and update this lib by np update.

f22hd commented 4 years ago

It seems not compatible with angular v9. there is PR for resolving this issue , https://github.com/lukasz-galka/ngx-gallery/pull/304

tomcoppensucll commented 4 years ago

Any plans on fixing this? Kolkov's version works but the scaling is a bit off in my apllication.

rsawik commented 4 years ago

thanks for help kolkov

Nasun4o commented 4 years ago

I hope this to be resolve Angular 9

mayursalunkhe commented 4 years ago

I have same issue with angular 9, thanks for your help kolkov. it worked.

pouyada commented 4 years ago

Swipe does not work for me. any solution?

Rkymishra commented 4 years ago

Swipe does not work for me. any solution?

export class CustomHammerConfig extends HammerGestureConfig { overrides = { pinch: { enable: false }, rotate: { enable: false }, }; }

sachinhd517 commented 4 years ago

Renderer error with angular 9

Below package.json file

{ "name": "app-spa", "version": "0.0.0", "scripts": { "ng": "ng", "start": "ng serve", "build": "ng build", "test": "ng test", "lint": "ng lint", "e2e": "ng e2e" }, "private": true, "dependencies": { "@angular/animations": "~9.0.1", "@angular/common": "~9.0.1", "@angular/compiler": "~9.0.1", "@angular/core": "~9.0.1", "@angular/forms": "~9.0.1", "@angular/platform-browser": "~9.0.1", "@angular/platform-browser-dynamic": "~9.0.1", "@angular/router": "~9.0.1", "@auth0/angular-jwt": "^4.0.0", "alertifyjs": "^1.13.1", "bootstrap": "^4.4.1", "bootswatch": "^4.4.1", "font-awesome": "^4.7.0", "ngx-bootstrap": "^5.5.0", "ngx-gallery": "^5.10.0", "rxjs": "~6.5.4", "tslib": "^1.10.0", "zone.js": "~0.10.2" }, "devDependencies": { "@angular-devkit/build-angular": "~0.900.2", "@angular/cli": "~9.0.2", "@angular/compiler-cli": "~9.0.1", "@angular/language-service": "~9.0.1", "@types/node": "^12.11.1", "@types/jasmine": "~3.5.0", "@types/jasminewd2": "~2.0.3", "codelyzer": "^5.1.2", "jasmine-core": "~3.5.0", "jasmine-spec-reporter": "~4.2.1", "karma": "~4.3.0", "karma-chrome-launcher": "~3.1.0", "karma-coverage-istanbul-reporter": "~2.1.0", "karma-jasmine": "~2.0.1", "karma-jasmine-html-reporter": "^1.4.2", "protractor": "~5.4.3", "ts-node": "~8.3.0", "tslint": "~5.18.0", "typescript": "~3.7.5" } }

pouyada commented 4 years ago

Swipe does not work for me. any solution?

export class CustomHammerConfig extends HammerGestureConfig { overrides = { pinch: { enable: false }, rotate: { enable: false }, }; }

Didn't help

f3l1xss commented 4 years ago

Swipe does not work for me. any solution?

export class CustomHammerConfig extends HammerGestureConfig { overrides = { pinch: { enable: false }, rotate: { enable: false }, }; }

Didn't help

Did you find any solution @pouyada ? I can't believe that the author simply abandon this project without saying anything

sachinhd517 commented 4 years ago

Hi, I have the same issue a few days ago. "Renderer error with angular 9" what to need to do uninstall ngx-gallery then install ngx-gallery-9 "https://www.npmjs.com/package/ngx-gallery-9" might be working.

pouyada commented 4 years ago

Swipe does not work for me. any solution?

export class CustomHammerConfig extends HammerGestureConfig { overrides = { pinch: { enable: false }, rotate: { enable: false }, }; }

Didn't help

Did you find any solution @pouyada ? I can't believe that the author simply abandon this project without saying anything

Nothing yet. I just went live without swip with ngx-gallery-9 . It's quite weird!

f3l1xss commented 4 years ago

whats the difference between ngx-gallery-9 and https://github.com/kolkov/ngx-gallery ? My god, ppl please stop creating new repo from the same library

pouyada commented 4 years ago

whats the difference between ngx-gallery-9 and https://github.com/kolkov/ngx-gallery ? My god, ppl please stop creating new repo from the same library

This ngx-gallery-9 is the only working version with angular 9. There is no difference, just renderer error has been fixed on this repo. And of course swipe doesn't work.

f3l1xss commented 4 years ago

whats the difference between ngx-gallery-9 and https://github.com/kolkov/ngx-gallery ? My god, ppl please stop creating new repo from the same library

This ngx-gallery-9 is the only working version with angular 9. There is no difference, just renderer error has been fixed on this repo. And of course swipe doesn't work.

Okay so basically no difference with kolkov version.., such a shame that this project is not maintained anymore. Have looked at other library but so far I like the design here most

f3l1xss commented 4 years ago

@pouyada Have spent half day to resolve this turns out its just one line fix to import HammerModule as described here:

angular/angular#32203

By default Ivy (Angular 9) will NO longer include HammerSupport and thereby we have to import it manually at root.

And its no longer neccessary to create custom config like this: providers: [ { provide: HAMMER_GESTURE_CONFIG, useClass: CustomHammerConfig }, { provide: HTTP_INTERCEPTORS, useClass: AjaxHeaderInterceptor, multi: true } ],

as well as to include hammer.js script at angular.json, swiping will work just by importing HammerModule

pouyada commented 4 years ago

@pouyada Have spent half day to resolve this turns out its just one line fix to import HammerModule as described here:

angular/angular#32203

By default Ivy (Angular 9) will NO longer include HammerSupport and thereby we have to import it manually at root.

And its no longer neccessary to create custom config like this: providers: [ { provide: HAMMER_GESTURE_CONFIG, useClass: CustomHammerConfig }, { provide: HTTP_INTERCEPTORS, useClass: AjaxHeaderInterceptor, multi: true } ],

as well as to include hammer.js script at angular.json, swiping will work just by importing HammerModule

Thanks for help. I also tried to import hammer in angular.json but no chance. Can you share a pieces of your angular.json to show me how you import the HammerModule?

f3l1xss commented 4 years ago

@pouyada No, don't import it at angular.json, import it at your root module aka app.module.ts like this

https://dev.to/susomejias/solution-working-hammer-js-after-upgrading-to-angular-9-25n2

pouyada commented 4 years ago

@pouyada No, don't import it at angular.json, import it at your root module aka app.module.ts like this

https://dev.to/susomejias/solution-working-hammer-js-after-upgrading-to-angular-9-25n2

Thanks. This was my first try and didn't work. I am using angular material, i think it hast something to do with that.

f3l1xss commented 4 years ago

Oh I see,what you can do is that you can try to remove angular material temporarily and use the gallery at your root component to eliminate any possible other dependency impact and see if swiping works. Also you did not forget to enable swiping settings right? There are 3 of them : imageSwipe, thumbnailSwipe, previewSwipe. Just set all of them to true to test.

And lastly I am using kolkov version, I am not sure about ngx gallery 9

f3l1xss commented 4 years ago

Check out this repo and play around with the code

https://github.com/windcloak/firecloak-web

She's using Angular9 with kolkov version of ngx-gallery

pouyada commented 4 years ago

Oh I see,what you can do is that you can try to remove angular material temporarily and use the gallery at your root component to eliminate any possible other dependency impact and see if swiping works. Also you did not forget to enable swiping settings right? There are 3 of them : imageSwipe, thumbnailSwipe, previewSwipe. Just set all of them to true to test.

And lastly I am using kolkov version, I am not sure about

I'll test on a new project without ng material.thanks again

KaviyaShanmugam22 commented 4 years ago

Hi, I have the same issue a few days ago. "Renderer error with angular 9" what to need to do uninstall ngx-gallery then install ngx-gallery-9 "https://www.npmjs.com/package/ngx-gallery-9" might be working.

Thank You So much.. Its working now..

resuta566 commented 4 years ago

Still no update on this repo? This is dead, I guess??

mahrijemalsaparova commented 4 years ago

make sure that all imports are correct on your components after Installation : npm install @kolkov/ngx-gallery

import { NgxGalleryAnimation, NgxGalleryImage, NgxGalleryOptions } from '@kolkov/ngx-gallery'; import { NgxGalleryModule } from '@kolkov/ngx-gallery';

kartikupadhyay90 commented 4 years ago

+1 experiencing the same Issue

jbagalanon commented 4 years ago

ngx-gallery 5.10.0 is outdated. Use ngx-gallery-9 for angular 9

mukkams commented 4 years ago

Still no update on this repo? This is dead, I guess??

Use ngx-gallery-9 instead

attractive-ang-vue-react-dev commented 3 years ago

https://github.com/kolkov/ngx-gallery try this fully compatible Angular 8, 9 versions, please.

That's really working fine. Thanks for sharing the information.

scorp559 commented 2 years ago

After updating to angular V9, the Renderer class was removed, so there's a few errors being thrown:

ERROR in node_modules/ngx-gallery/ngx-gallery-helper.service.d.ts:1:22 - error TS2724: Module '"C:/Users/Documents/repos/real-estate-client/node_modules/@angular/core/core"' has no exported member 'Renderer'. Did you mean 'Renderer2'?

1 import { ElementRef, Renderer } from '@angular/core';
                       ~~~~~~~~

  node_modules/@angular/core/core.d.ts:5680:31
    5680 export declare abstract class Renderer2 {
                                       ~~~~~~~~~
    'Renderer2' is declared here.
node_modules/ngx-gallery/ngx-gallery-preview.component.d.ts:1:89 - error TS2724: Module '"C:/Users/Documents/repos/real-estate-client/node_modules/@angular/core/core"' has no exported member 'Renderer'. Did you mean 'Renderer2'?

1 import { ChangeDetectorRef, EventEmitter, OnInit, OnChanges, SimpleChanges, ElementRef, Renderer } from '@angular/core';
                                                                                          ~~~~~~~~

  node_modules/@angular/core/core.d.ts:5680:31
    5680 export declare abstract class Renderer2 {
                                       ~~~~~~~~~
    'Renderer2' is declared here.

But what is solution i just moved from 8 to 9 and giving this error

lukasz-galka / ngx-gallery

Renderer error with angular 9 #302