Angular Datatable报错：ColumnSettings类型不存在AppComponent属性如何解决

你遇到的类型报错是因为普通函数会绑定自身的this指向：你用function声明的render方法里，TS默认将this推断为列配置对象ColumnSettings的类型，该对象上不存在你在组件中注入的AppComponent属性，因此触发2339类型错误。

下面三种常用方案都可以解决这个问题：

方案1：改用箭头函数（最推荐） #

箭头函数不会创建自己的this，会继承外层作用域（也就是你的组件实例）的this，直接就能访问到注入的AppComponent：

columns: [
{
    render: (data, type, full, meta) => {
    if (this.AppComponent.checkModulePermission('subadmin', 'sub_admin', 'view')) { 
        // 你的业务代码
    }
}
]

方案2：提前缓存组件实例的this引用 #

如果需要保留普通函数的写法，可以在外层作用域提前把组件实例的this存为变量，在render函数内直接调用该变量即可：

// 在定义columns的外层作用域先存this
const componentInstance = this;
columns: [
{
    render: function (data, type, full, meta) {
    if (componentInstance.AppComponent.checkModulePermission('subadmin', 'sub_admin', 'view')) { 
        // 你的业务代码
    }
}
]

方案3：用bind手动绑定this指向 #

可以通过bind方法手动把render函数的this绑定为当前组件实例：

columns: [
{
    render: function (data, type, full, meta) {
    if (this.AppComponent.checkModulePermission('subadmin', 'sub_admin', 'view')) { 
        // 你的业务代码
    }
}.bind(this) // 绑定外层组件的this
}
]

内容的提问来源于stack exchange，提问作者PRAMIT PAUL