Angular：错误：模板解析错误：意外的结束标记

Question

我创建了一个新项目（使用 Angular CLI - 25/05/17）并将以下 HTML 代码复制到一个新组件中。它看起来像基本的 HTML 代码——它作为自己的 HTML 页面工作——但现在它在 Angular 中无法编译，这让我摸不着头脑。我已经研究过这个问题，每个人的情况都不同——有些是代码中的拼写错误，有些是错误排序的标签。有什么想法吗？

我收到此错误：

    Error: Template parse errors:
Unexpected closing tag "table". It may happen when the tag has already been closed by another tag. For more info see https://www.w3.org/TR/html5/syntax.html#closing-elements-that-have-implied-end-tags ("
      </th>
    </tr>
  [ERROR ->]</table>
</div>

"): ng:///AppModule/FooterbarComponent.html@24:2
Unexpected closing tag "div". It may happen when the tag has already been closed by another tag. For more info see https://www.w3.org/TR/html5/syntax.html#closing-elements-that-have-implied-end-tags ("
    </tr>
  </table>
[ERROR ->]</div>

<!--
"): ng:///AppModule/FooterbarComponent.html@25:0

我的代码是：

<div id="footerRoot">
  <table class="footerfont" width="100%">
    <col width="75%">
    <col width="25%">
    <tr>
      <th>
        <ol class="zeroMargin breadcrumb">
          <li><a href="" target="_blank" class="link-external">State</a></li>
          <li><a href="">Accessibility</a></li>
          <li><a href="" target="_blank" class="link-external">Copyright &amp; Disclaimer</a></li>
          <li><a href="" target="_blank" class="link-external">Privacy</a></li>
          <li><a href="">Sitemap</a></li>
          <li><a href="">Feedback</a></li>
        </ol>
      </th>
      <th class="footerfont">
        <div>
          © BLAH
        </div>
        <div>
          Last Updated: <time datetime="18 April 2017">18 April 2017</time>
        </div>
      </th>
    </tr>
  </table>
</div>

Answer 1

以下代码已弃用并导致 HTML 解析错误：

 <col width="75%">
 <col width="25%">

删除这些并使用 CSS 处理列宽解决了这个问题。