Angular 6.x 在 IE 11 中不起作用 - 错误：参数无效答案

【问题标题】：Angular 6.x not working in IE 11 - Error: Invalid argumentAngular 6.x 在 IE 11 中不起作用 - 错误：参数无效
【发布时间】：2019-05-05 21:50:13
【问题描述】：

我有一个 Angular 6.x 应用程序在 Chrome 中完美运行。问题是尝试在 IE 11 中运行它时，出现错误：

错误：参数无效。在 DefaultDomRenderer2.prototype.setProperty...

已经在 StackOverflow 中尝试了所有我在没有帮助的情况下可以找到的答案。我在这里列出主题，所以你们不会尝试将它们作为答案：

添加到head标签中：

<meta http-equiv="X-UA-Compatible" content="IE=11">

感谢您的帮助。

【问题讨论】：

不支持 IE11 是我的建议。严重地。如果你真的需要 - 我建议使用 ng update 将你的项目更新到最新版本的 Angular。我似乎记得他们最近解决了一些 polyfill 的问题。
您能否发布足够的代码来重现问题，如Minimal, Complete, and Verifiable example。我创建了一个新的 angular6 示例并添加了 header 标签，看来我这边一切正常。
@ZhiLv-MSFT 我会努力做到的

【解决方案1】：

我发现了问题并解决了它。我写这个答案是为了为其他面临这个问题的人节省时间。

问题将一个不正确值的变量绑定到HTML attribute（任何HTML属性）。

例如

将变量分配给 p 标记中的 dir 属性，必须使用 dir 属性的可能值之一定义，分别是：ltr | rtl | auto

在 html 中有这一行：<p [dir]="myDir">Test</p>

当 myDir = undefined 或 myDir = 'bla bla bla' 或任何其他不正确的值 - 我们会收到错误。

当myDir = 'rtl' 或任何其他正确值时 - 我们不会收到错误。

添加了DEMO 以在 IE 中运行以查看此错误的重现。

总结我想我们可以说，当绑定到一个 HTML 属性时，我们必须非常小心地拥有一个有效的属性值，这样我们就不会遇到这个问题。

【讨论】：

使用<input [type]="text"> 而不是<input type="text"> 得到了完全相同的消息（以防我以外的其他人在谷歌搜索此确切错误消息后来到这里）。其他浏览器没有错误消息。
相同，但使用 <textarea [rows]="rows"> 我的组件的值无效（行数为“-1”），但在 Chrome 中，DOM 以 rows="2" 结束，而在 IE 中它仍在尝试设置它为“-1”。由于将其更改为 -1 情况下返回 null 以完全抑制属性的 fn 也不起作用，因此我最终将绑定更改为使用 [attr.rows]，这将成功接受 null 并省略该属性。跨度>

【解决方案2】：

我在使用时也遇到了这个错误：

const input = {
   time: 'time',
   date: 'date'
}

<input [type]="input.date"/>
<input [type]="input.time"/>

IE 11 输入不支持日期和时间类型。所以任何 IE 不支持的元素都可能会抛出同样的错误。

【讨论】：