Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Compatibility with the Ivy view engine #283

Open
Yawarzy opened this issue May 22, 2023 · 18 comments
Open

Compatibility with the Ivy view engine #283

Yawarzy opened this issue May 22, 2023 · 18 comments

Comments

@Yawarzy
Copy link

Yawarzy commented May 22, 2023

Hi,
We want to upgrade our project to the Angular 16, so we need to confirm whether the libraries we are using are ivy compatible or not, so we would like to confirm whether this library is compatible with the Ivy or not ?
Thanks

@inexuscore
Copy link

I've upgraded to Angular 16 and this is the only package lagging behind. Any news on this? A fork would be nice too.

@IngMichaelMayr
Copy link

Hi, got the same problem on my side

@IngMichaelMayr
Copy link

As a fix for me, I decided to switch from ngx-sortablejs to angulars own drap and drop interface: https://material.angular.io/cdk/drag-drop/overview#transferring-items-between-lists

@COBRASoft5
Copy link

Unfortunately, that doesn't work very well with display: grid :(.

@Yawarzy
Copy link
Author

Yawarzy commented Jun 13, 2023

Hi guys, we were using nx so we just took the library into the project.

@stuartmackey
Copy link

I discovered this library -> https://github.com/Liquid-JS/nxt-components it includes a fork that only needs a couple of tweaks to get working. Have a look at the breaking changes to see what needs to be renamed -> https://github.com/Liquid-JS/nxt-components/blob/master/BREAKING_CHANGES.md

@nzbin
Copy link

nzbin commented Aug 2, 2023

Hi, folks, I suggest you can try the ng-dnd library
https://github.com/ng-dnd/ng-dnd

@alexisGandar
Copy link

alexisGandar commented Oct 19, 2023

You guys think there is any chance the plugin get updated ?

@alexisGandar
Copy link

Here is a link of a fork working for angular16 for the ones that are interested : https://github.com/epicuro/ngx-sortablejs

@COBRASoft5
Copy link

Here is a link of a fork working for angular16 for the ones that are interested : https://github.com/epicuro/ngx-sortablejs

Is there an npm package for this fork available?

@guoliang
Copy link

Here is a link of a fork working for angular16 for the ones that are interested : https://github.com/epicuro/ngx-sortablejs

Is there an npm package for this fork available?

You can install package from his fork with npm
npm install https://github.com/epicuro/ngx-sortablejs

@adam-drozdz-ie
Copy link

Here is a link of a fork working for angular16 for the ones that are interested : https://github.com/epicuro/ngx-sortablejs

I tried to use this fork, but I'm getting this error:
Module not found: Error: Can't resolve 'ngx-sortablejs-app'
I've installed the fork with npm install https://github.com/epicuro/ngx-sortablejs and then added it to app.module.ts as instructed by the readme.

Here's a repository to reproduce this problem.
Could someone help me resolve it?

@danitoro97
Copy link

Hi, have same problem that @adam-drozdz-ie . I found another repo and it works fine https://www.npmjs.com/package/nxt-sortablejs

@adam-drozdz-ie
Copy link

Hi, have same problem that @adam-drozdz-ie . I found another repo and it works fine https://www.npmjs.com/package/nxt-sortablejs

Thanks for the suggestion, but I can't find the equivalent of [sortablejsOptions] in nxt-sortablejs 🤔

@danitoro97
Copy link

u can use config , https://liquid-js.github.io/nxt-components/demo/sortablejs#example-4 look demo

@adam-drozdz-ie
Copy link

u can use config , https://liquid-js.github.io/nxt-components/demo/sortablejs#example-4 look demo

Great, thank you!

@basvandorst
Copy link

basvandorst commented Nov 22, 2023

Is there an npm package for this fork available?

You can install package from his fork with npm npm install https://github.com/epicuro/ngx-sortablejs

Thanks for this fork! Installation should be go via a subfolder of this fork.

https://gitpkg.now.sh could fix it because npm install http://github.com/.... does not allow installation from a repo subfolder

@adam-drozdz-ie @danitoro97 this works for us:
npm install https://gitpkg.now.sh/epicuro/ngx-sortablejs/dist/ngx-sortablejs

@tiro-reflact
Copy link

I had the same problem as described above for a little while now, that this package is lacking behind with its version.
But today I found the solution and it's the official way by Angular!

I was able to fully remove and replace the following dependencies: sortablejs, @types/sortablejs & ngx-sortablejs

I installed the Official Angular Component Development Kit

npm i @angular/cdk

and imported the following module

import { DragDropModule } from '@angular/cdk/drag-drop';

DragDropModule

I would say that you can probably use all the features of ngx-sortablejs here too (with slightly different syntax) and I have to say, all the ones I've used can do the Angular Library even better (the auto-scroll feature for example)!

Here's the link for the documentation: https://material.angular.io/cdk/drag-drop/overview
Don't be scared that it's the Angular Material Documentation and you don't use Material: the Component Development Kit is fully independent from Material and can be used in any other way, for example in combination with Bootstrap.

And take a look here at the moveItemInArray function, it saved me multiple lines of code: https://material.angular.io/cdk/drag-drop/api#cdk-drag-drop-functions

I'd recommend that you read the full documentation about Drag and Drop to find every feature that you need (they are named different sometimes in comparison to ngx-sortablejs).

And while you're exploring the CDK: It has some really cool directives to explore too for example the virtual scrolling!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging a pull request may close this issue.