为什么colspan在Angular 2中不是已知的本机属性？

为了理解它，我们需要对文档对象模型(DOM)和超文本标记语言(HTML)之间有清楚的深入了解。
基本上，DOM是对象的模型，是文档的逻辑树表示形式，而HTML是我们用来构建网页的标记语言。
每个HTML属性都具有到DOM对象属性的一对一映射。

示例：名字

First Name 

因此，以上示例包含两个标签label和input。如我们所见，在输入标签中定义了一个“禁用”属性。
同样，如果您谈论DOM属性，则在输入对象中也存在禁用状态。
但是在某些情况下，HTML标签的某些属性在DOM中不可用。
示例：colspan。像colspan一样，因此当您尝试将它们用于Angular 2+中的属性绑定时，会收到一条错误消息，提示“无法绑定到colspan，因为它不是’td’的已知属性”。
同样，我们具有一些在DOM中定义但在HTML中不存在的属性。

例子：

解决方案：
为了将它们用于属性绑定，您需要使用以下语法“ [attr.colspan]”。

import {Component} from '@angular/core';
  
  
@Component({
  
selector:'app-colspan',
template:
`
 Colspan Usage 

  
   
  
  
   
   
  
First Item 
Second Item
Third Item 

`,
styles:[`
  
table, tr, td{
border: 1px solid black;
border-collapse:collapse;
}
`]
})
  
  
export class ColSpanComponent{
  
colSpan="2"
  
}

输出：