Angular Ng2智能表格：在内联编辑中使用下拉列表或日期选择器

我正在为Angular2搜索更好的表表示，发现它很好用。但问题是，它似乎没有提供一种在在线编辑中使用下拉列表或日期选择器的直接方法

---

是否有任何方法使之成为可能，或者我可以在Angular2应用程序中使用哪些替代组件来表示表视图

我在下拉列表中找到了类似的内容：

private settings = {
  columns: {
    name: {
      title: 'Name'
    },
    valid: {
      title: 'Valid',
      type: 'html',
      editor: {
        type: 'list',
        config: {
          list: [
            {value: true, title: 'Valid'},
            {value: false, title: 'Not valid'}
          ],
        },
      }
    }, //... more columns
  }
}

对于日期选择器：

在设置中[.ts]

在dob.component.html中

在你的模块中

希望这有帮助

参考：，

---

当我使用@ampati hareesh的解决方案时，我有三个问题

“具有未指定名称属性的窗体控件没有值访问器”。将ngDefaultControl添加到owl日期时间解决了这个问题

无法读取未定义的属性“isInSingleMode”。添加“输入”标签解决了这个问题

未指定值。将事件从“单击”更改为“afterPickerClosed”解决了此问题

我最后的dob.component.html看起来像

    <input placeholder=""
                        [(ngModel)]="dateValue"
                        [owlDateTimeTrigger]="dt1" [owlDateTime]="dt1">
    <owl-date-time [pickerType]="'calendar'" autoClose [(ngModel)]="dateValue" 
         ngDefaultControl dataType="string" 
         (afterPickerClosed)="updateValue()" #dt1>
    </owl-date-time>

<代码>公共设置={ 行动：{ 位置：'右'， //自定义：[{name:'routeToAPage'，title:``}] }, 栏目：{ ctg_名称：{ 标题：“类别”， }, ctg_可见：{ 标题：“可见”， 编辑:{ 键入：“列表”， 配置：{ selectText:“选择”， 名单：[ {value:'1'，title:'True'}， {value:'0'，title:'False'} ], }, } } },

---

};对不起。我刚刚看到了这个答案。这太棒了。不知道你在哪里找到的。日期选择器部分呢？用于编辑数据时的简单设置下拉列表。这将很好。似乎ng2智能表的datepicker功能将很快发布：-使用建议的自定义视图渲染器是目前最好的选择。

<owl-date-time autoClose [(ngModel)]="datevalue" dataType="string" 
 (click)="updateValue()">
</owl-date-time>

datevalue: any;
  updateValue(){
    console.log(this.datevalue);
    this.cell.newValue = this.datevalue;
  }
where your DoBComponent extends DefaultEditor

     declarations:[
//other compnents here
        DoBComponent
     ]
     entryComponents: [
      DoBComponent
    ]

    <input placeholder=""
                        [(ngModel)]="dateValue"
                        [owlDateTimeTrigger]="dt1" [owlDateTime]="dt1">
    <owl-date-time [pickerType]="'calendar'" autoClose [(ngModel)]="dateValue" 
         ngDefaultControl dataType="string" 
         (afterPickerClosed)="updateValue()" #dt1>
    </owl-date-time>