2017-12-04 13 views
0

私は自分のアプリケーション用に構築したコンポーネントをスタンドアロンモジュールに移動しようとしています。コンポーネントは、ドラッグアンドドロップサポートにng2-dndを使用します。実行時に、dropZonesがのプロパティではないことを不平を言っているテンプレートを解析するときので、私は、明らかに何かが欠けている'li'のプロパティが知られていないため、 'dropZones'にバインドできません

リスト-editor.component.html

<ul dnd-sortable-container [sortableData]="list" [dropZones]="[id]"> 
    <li *ngFor="let value of list; index as i" 
     dnd-sortable [sortableIndex]="i" [dropZones]="[id]"> 
    <drag-handle></drag-handle> 
    <ng-content></ng-content> 
    <action-insert></action-insert> 
    <action-delete></action-delete> 
    </li> 
</ul> 

:それはこのようになります<li>。通知すると、<ul>については不満はなく、<li>のみとなります。また、作業コードを取り込んでモジュールに移動したので、誤植のようなコンポーネントテンプレートについては、タイプミスのようにはっきりとしたものではありません。だから私は、私がモジュールの設定に間違ったことをしたと仮定することができます。

リスト-editor.module.ts

import { NgModule }  from '@angular/core'; 
import { CommonModule } from '@angular/common'; 

import { DndModule } from 'ng2-dnd'; 

import { ListEditorComponent } from './list-editor.component'; 
import { DragHandleComponent } from './drag-handle/drag-handle.component' 
import { ActionComponent }  from './action-button/action.component'; 
import { InsertComponent }  from './insert-button/insert.component'; 
import { DeleteComponent }  from './delete-button/delete.component'; 

@NgModule({ 
    imports: [ 
    CommonModule, 
    DndModule.forRoot(), 
    ], 
    declarations: [ 
    ListEditorComponent, 
    ValueComponent, 
    DragHandleComponent, 
    ActionComponent, 
    InsertComponent, 
    DeleteComponent 
    ], 
    exports: [ 
    ListEditorComponent, 
    ValueComponent, 
    ] 
}) 
export class ListEditorModule { } 

私は私のアプリでは、他のモジュールがそうであるように、私はそれをインポートします。

app.module.tsを

import { ListEditorModule } from '@module/list-editor/list-editor.module'; 

@NgModule({ 
    declarations: [ ... ], 
    imports: [ ... , ListEditorModule, ... ], 
    ... 
}) 
export class AppModule { ... } 

もちろん、私は自分のアプリでそれを使用します:

<list-editor [list]="theList"><value></list-editor> 

何か間違っているのですか、どこかにバグがありますか?

角度5.0.5に更新しました。まだ問題は残っています。

答えて

0

ただ、それ以外の場合は、入力として処理することとli要素は、 `[dropZones]を削除

<li *ngFor="let value of list; index as i" 
     dnd-sortable [sortableIndex]="i" > 
+0

を持つことが期待され、李から[dropZones]削除'それを修正しませんでした。エラーは消えましたが、DragAndDropは機能しませんでした。そして、これはモジュールではなく、アプリに直接埋め込まれたときに動作するコードです。 –

関連する問題