angular - ng2-dnd 与 Angular 4

标签 angular drag-and-drop drag

我正在尝试在 Angular 项目中实现拖放 ( https://github.com/akserg/ng2-dnd )。

我的配置(ng -v):

@angular/cli: 1.1.3
node: 6.10.1
os: win32 x64
@angular/animations: 4.2.4
@angular/common: 4.2.4
@angular/compiler: 4.2.4
@angular/core: 4.2.4
@angular/forms: 4.2.4
@angular/http: 4.2.4
@angular/platform-browser: 4.2.4
@angular/platform-browser-dynamic: 4.2.4
@angular/router: 4.2.4
@angular/cli: 1.1.3
@angular/compiler-cli: 4.2.4
@angular/language-service: 4.2.4

我的步骤:

  1. 创建新项目:ng new myProject --style=sass
  2. 安装 ng2-dnd:npm install ng2-dnd --save
  3. 在我的 NgModule 中导入 DndModule:

import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { DndModule } from 'ng2-dnd';

@NgModule({
    declarations: [
        AppComponent
    ],
    imports: [
        BrowserModule,
        DndModule.forRoot()
    ],
    providers: [],
    bootstrap: [AppComponent]
})
export class AppModule { }
  • node_modules导入style.css
  • 完成此步骤后,我像在 github 上一样添加了一个模板,但没有结果。我只看到纯文本,即使没有样式。

    我做错了什么?

    最佳答案

    你应该在 angular-cli.json 中导入样式

     "styles": [
            "../node_modules/ng2-dnd/style.css",
          ],
    

    关于angular - ng2-dnd 与 Angular 4,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44727674/

    相关文章:

    angular - 在 Angular Route 中传递 int 数组

    c# - 在 Excel 中执行拖放操作时 DragDrop.DoDragDrop 不返回

    google-maps-api-3 - map 上的 Google Map Api v3 拖动事件

    javascript - 如何防止人们掉落在不可掉落元素中?

    Swift-拖动自定义 slider

    javascript - 拖放跨域、iframe、浏览器窗口

    angular - 如何在 Angular 5 中获取当前路线

    angular - 从 CDK Overlay Portal 获取对组件的引用

    javascript - 如何使用展开运算符从对象数组中删除重复项

    android - 不会阻止在 Android 中拖放的不显眼的弹出窗口