Angular7 SCRIPT445: объект не поддерживает это действие IE sortable.js

Question

Я использую сортируемую JS с Angular7 и, нажимая на значок сортируемой, я получаю эту ошибку в IE:

SCRIPT445: объект не поддерживает это действие

без дополнительной информации, кроме: Файл: polyfills.js, строка: 8103, столбец: 25

Пытался исследовать или искать решение, но безрезультатно может кто-то помочь?

Удаление sortable.js не выдает эту ошибку. Также это работало в A5

Answer 1

Вы можете обратиться к следующим шагам, чтобы использовать sortablejs и angular-sortablejs.

1. установите сортируемый пакет и импортируйте ссылку.

   Установить sortablejs .

   с помощью следующей команды для установки Sortablejs.

   npm install sortablejs --save
   

   Затем проверьте папку node_modules, чтобы проверить, содержит ли она этот плагин.

   После этого откройте файл angular.json, чтобы добавить ссылку на js:

   "scripts": ["node_modules/sortablejs/Sortable.min.js"]
   

   Установка angular-sortablejs

   с помощью следующей команды для установки angular-sortablejs:

   npm i sortablejs angular-sortablejs
   

   Затем в файле app.module.ts импортируйте модуль SortablejsModule, например, так:

   import { BrowserModule } from '@angular/platform-browser';
   import { NgModule } from '@angular/core';
   import { SortablejsModule} from 'angular-sortablejs'
   import { AppComponent } from './app.component';
   
   @NgModule({
     declarations: [
       AppComponent
     ],
     imports: [
       BrowserModule,
       SortablejsModule
     ],
     providers: [],
     bootstrap: [AppComponent]
   })
   export class AppModule { }
   

2. с использованием этих плагинов в угловых компонентах:

   app.component.ts:

   import { Component, OnInit } from '@angular/core';
   
   // import the sortablejs
   import * as Sortable from 'sortablejs'
   import { $ } from 'protractor';
   @Component({
   selector: 'app-root',
   templateUrl: './app.component.html',
   styleUrls: ['./app.component.css']
   })
   export class AppComponent implements OnInit {
   title = 'angular-sample';
   
   cities = [
       'Ankara',
       'Moscow',
       'Munich',
       'Paris',
       'Washington',
   ];
   
   ngOnInit (){
   
       var el = document.getElementById('items');
       var sortable = Sortable.create(el);
   }
   }
   

   app.component.html

   <!--The content below is only a placeholder and can be replaced.-->
   <div style="text-align:center">
   <h1>
       Welcome to {{ title }}!
   </h1>
   </div>
   
   <h2>using angular-sortablejs</h2>
   <ul class="nav nav-pills mb-3" [sortablejs]="cities">
   <li class="nav-item" *ngFor="let city of cities">
       <a class="nav-link active mr-1">{{ city }}</a>
   </li>
   </ul>
   
   <h2>using SortableJS/Sortable</h2>
   <ul id="items">
       <li>item 1</li>
       <li>item 2</li>
       <li>item 3</li>
   </ul>
   

Результат такой:

И файл полифилла вот так .