我已经在Google上搜索了此文件,但没有找到有效的“解决方案”,并且是从2016年开始的。我在1.x上可以正常使用,但现在我正尝试按照迁移指南进行更新到2.0。
我在HTML中有一个类似的设置,其中包含两个包含列表的Bootstrap卡:
<div class="row">
<div class="col">
<div class="card">
<div class="card-header">Fruits</div>
<div class="card-body">
<ul [dragula]="firstbag"
[(dragulaModel)]="produce.fruits"
class="drag-container">
<li *ngFor="let item of produce.fruits"
class="drag-item">{{item.label}}</li>
</ul>
</div>
</div>
</div>
<div class="col">
<div class="card">
<div class="card-header">Vegetables</div>
<div class="card-body">
<ul [dragula]="firstbag"
[(dragulaModel)]="produce.vegetables"
class="drag-container">
<li *ngFor="let item of produce.vegetables"
class="drag-item">{{item.label}}</li>
</ul>
</div>
</div>
</div>
</div>
但是,当我尝试编译它时,我得到了:
ERROR in : Can't bind to 'dragula' since it isn't a known property of 'ul'. (" class="card-header">Fruits</div>
<div class="card-body">
<ul [ERROR ->][dragula]="firstbag"
[(dragulaModel)]="produce.fruits"
")
: Can't bind to 'dragulaModel' since it isn't a known property of 'ul'. (" <div class="card-body">
<ul [dragula]="firstbag"
[ERROR ->][(dragulaModel)]="produce.fruits"
class="drag-container">
")
我已按照我的应用模块中的说明导入:
import { DragulaModule } from 'ng2-dragula';
@NgModule({
imports: [
...,
DragulaModule.forRoot()
],
})
export class AppModule { }
列表的数据在我的组件中
produce = {
fruits: [
{
id: 0,
label: 'Squash'
},
{
id: 1,
label: 'Pineapples'
},
{
id: 2,
label: 'Raspberries'
}
],
vegetables: [
{
id: 3,
label: 'Carrots'
}
]
};
如上所述,我已将html中的语法更改为[(dragulaModel)]
。
在这一点上,我迷路了。