angular-sortablejs - npm Package Compare versions

Comparing version 1.0.1 to 1.1.0

package.json

 {
   "name": "angular-sortablejs",
-  "version": "1.0.1",
+  "version": "1.1.0",
   "description": "SortableJS for Angular 2+",
@@ -5,0 +5,0 @@ "main": "index.js",

README.md

@@ -153,3 +153,9 @@ # angular-sortablejs
 ```
+### Bind events inside Angular zone
 
+By default, the boolean parameter **runInsideAngular** is set to **false**. 
+This means that the initial binding of all mouse events of the component will be set so that they **will not** trigger Angular's change detection. 
+
+If this parameter is set to true, then for large components - with a lot of data bindings - the UI will function in a staggered and lagging way (mainly when dragging items), while every event will trigger the change detection (which might be needed in some special edge cases).
+
 ### Configure the options globally
@@ -156,0 +162,0 @@

src/sortable.directive.js

@@ -23,8 +23,18 @@ "use strict";
 var SortablejsDirective = (function () {
-    function SortablejsDirective(element) {
+    function SortablejsDirective(element, zone) {
         this.element = element;
+        this.zone = zone;
+        this.runInsideAngular = false;
     }
     SortablejsDirective.prototype.ngOnInit = function () {
+        var _this = this;
         // onChange???
-        this._sortable = new Sortable(this.element.nativeElement, this.options);
+        if (this.runInsideAngular) {
+            this._sortable = new Sortable(this.element.nativeElement, this.options);
+        }
+        else {
+            this.zone.runOutsideAngular(function () {
+                _this._sortable = new Sortable(_this.element.nativeElement, _this.options);
+            });
+        }
     };
@@ -101,2 +111,6 @@ SortablejsDirective.prototype.ngOnDestroy = function () {
     ], SortablejsDirective.prototype, "_options", void 0);
+    __decorate([
+        core_1.Input(), 
+        __metadata('design:type', Boolean)
+    ], SortablejsDirective.prototype, "runInsideAngular", void 0);
     SortablejsDirective = __decorate([
@@ -106,3 +120,3 @@ core_1.Directive({
         }), 
-        __metadata('design:paramtypes', [core_1.ElementRef])
+        __metadata('design:paramtypes', [core_1.ElementRef, core_1.NgZone])
     ], SortablejsDirective);
@@ -109,0 +123,0 @@ return SortablejsDirective;

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

20695

increased by7.22%

Lines of code

305

increased by4.81%

Number of lines in readme file

184

increased by3.37%

No dependency changes