如何在Angular 2.0应用程序中使用Sortablejs之类的库？

我开始了一个新的，简单的Angular 2.0应用程序，并希望有一个可以拖动的项目列表

似乎是一个很好的工具，但似乎有几个障碍。据我所知，我必须：

1） 用于在Angular 1属性指令中包装Sortable.js

2） 使用将角度1元素指令用作角度2组件

3） 除了组件指令外，还可以使用升级工具的包装器来启用属性指令

然后我需要包括所有的文件，并将所有的指令混合在一起

从一个由生成的应用程序开始，我生成了一个路由，并让npm安装了NgaAdapter、angular、UpgradeAdapter和sortablejs。我把它添加到我的index.html文件中

<script type="text/javascript" src="/node_modules/sortablejs/ng-sortable.js"></script>
<script type="text/javascript" src="/node_modules/angular/angular-min.js"></script>

我对main.ts文件进行了如下编辑：

import { bootstrap } from '@angular/platform-browser-dynamic';
import { enableProdMode } from '@angular/core';
import { MySimpleAppComponent, environment } from './app/';
import { upgradeAdapter } from './app/upgrade_adapter';
import { angular } from '../node_modules/angular'; // here's the problem. I don't know how to get angular
import { ngAdapter } from 'ngAdapter/build/ngAdapter';

//create your AngularJS module 
let module = angular.module('MyApp', []);

//create adapter 
let adapter = new ngAdapter(module);

if (environment.production) {
  enableProdMode();
}

// bootstrap(MySimpleAppComponent);          // what it was originally
adapter.bootstrap(document.body, ['MyApp']); // from ngadapter instructions

我肯定这里有很多错误，但第一条错误信息是

• 找不到名称“angular”

我很确定答案在里面，但我不明白。你知道如何设置角度物体吗？我走对了吗？我没有嫁给Sortable，但我希望我在尝试使用Angular 2的其他库时也会遇到同样的问题，我想知道如何做到这一点

---

有没有更好的或标准的方法来使用不是为Angular 2设计的好javascript库？

如果这仍然是事实，并且这是一个关于Sortablejs的问题（不是一个常见的问题），您可能会想使用它。我问的是如何使用Angular 2的库。如果你是一个初学者，一般的答案似乎是——等一位专家做出这样的东西，让它起作用。我很高兴有人这么做了！这似乎不是一件小事。首先，这个人就是我。但我还是不明白你的意思。是否要在angular 2中使用angular 1库？或者你只想在Angular 2中使用一个库？因为Sortablejs库首先只是一个库，然后才绑定到Angular 1。对我来说，你在这里的做法就像你试图给你的邻居送一个包裹，而不是仅仅把它带到隔壁。为什么不直接使用原始sortablejs而不调用sortablejs angular1绑定？angular2的优点是，即使没有绑定，它也可以完美地连接到任何库。我真的不在乎它是怎么发生的，只在乎它是怎么发生的。我想问的是，Angular 2中是否有使用任何javascript库的标准过程。已经编写了一个适配器“angular sortablejs”来为“sortablejs”实现这一点。我认为这样做是因为有必要这样做。我是一个初学者，没有这样的适配器，我不可能创建那个适配器，也不可能自己想出如何在Angular 2中使用Sortablejs。如果你擅长这一点，也许你会考虑发布一篇博客文章来回答这个问题。嗯，我可能不是做这件事的最佳人选。。。这个话题太大了。如果这仍然是一个关于Sortablejs的问题（不是一个常见的问题），你可能会想使用它。我问的是如何使用Angular 2的库。如果你是一个初学者，一般的答案似乎是——等一位专家做出这样的东西，让它起作用。我很高兴有人这么做了！这似乎不是一件小事。首先，这个人就是我。但我还是不明白你的意思。是否要在angular 2中使用angular 1库？或者你只想在Angular 2中使用一个库？因为Sortablejs库首先只是一个库，然后才绑定到Angular 1。对我来说，你在这里的做法就像你试图给你的邻居送一个包裹，而不是仅仅把它带到隔壁。为什么不直接使用原始sortablejs而不调用sortablejs angular1绑定？angular2的优点是，即使没有绑定，它也可以完美地连接到任何库。我真的不在乎它是怎么发生的，只在乎它是怎么发生的。我想问的是，Angular 2中是否有使用任何javascript库的标准过程。已经编写了一个适配器“angular sortablejs”来为“sortablejs”实现这一点。我认为这样做是因为有必要这样做。我是一个初学者，没有这样的适配器，我不可能创建那个适配器，也不可能自己想出如何在Angular 2中使用Sortablejs。如果你擅长这一点，也许你会考虑发布一篇博客文章来回答这个问题。嗯，我可能不是做这件事的最佳人选。。。这个话题太大了。也许我有时间可以试试

import { bootstrap } from '@angular/platform-browser-dynamic';
import { enableProdMode } from '@angular/core';
import { MySimpleAppComponent, environment } from './app/';
import { upgradeAdapter } from './app/upgrade_adapter';
import { angular } from '../node_modules/angular'; // here's the problem. I don't know how to get angular
import { ngAdapter } from 'ngAdapter/build/ngAdapter';

//create your AngularJS module 
let module = angular.module('MyApp', []);

//create adapter 
let adapter = new ngAdapter(module);

if (environment.production) {
  enableProdMode();
}

// bootstrap(MySimpleAppComponent);          // what it was originally
adapter.bootstrap(document.body, ['MyApp']); // from ngadapter instructions