无法在 'Element' 上执行 'setAttribute'：Angular 11

Question

我在新的 Angular 11 应用程序中遇到以下错误。找不到任何语法错误。

core.js:6156 ERROR DOMException: Failed to execute 'setAttribute' on 'Element': 'ng-reflect-Dev Portal' is not a valid attribute name.
    at EmulatedEncapsulationDomRenderer2.setAttribute (http://localhost:8080/admin/vendor.js:62217:16)
    at setNgReflectProperty (http://localhost:8080/admin/vendor.js:38053:26)
    at setNgReflectProperties (http://localhost:8080/admin/vendor.js:38078:13)
    at elementPropertyInternal (http://localhost:8080/admin/vendor.js:38001:13)
    at Module.ɵɵproperty (http://localhost:8080/admin/vendor.js:42749:9)
    at DevMainHeaderComponent_Template (http://localhost:8080/admin/app-layout-layout-module.js:394:65)
    at executeTemplate (http://localhost:8080/admin/vendor.js:37594:9)
    at refreshView (http://localhost:8080/admin/vendor.js:37463:13)

我的html模板如下，

<div class="row main-header-container">
  <div class="col-xs-12 col-sm-12 col-md-12 col-lg-8 col-xl-8 offset-lg-2 offset-xl-2">
    <div class="row">
      <div class="col-xs-6 col-sm-6 col-md-6 col-lg-2 col-xl-2" [ngClass]="(isLoggedInUser === true)?'offset-lg-3 offset-xl-3':'offset-lg-9 offset-xl-9'">
        <select class="form-control">
          <option>English</option>
          <option>Finish</option>
        </select>
      </div>
    </div>
  </div>
</div>

TS文件如下，

export class DevMainHeaderComponent implements OnInit {

  public isLoggedInUser = true;
}

如果我删除了 ngClass 指令，它会起作用，但我在这里找不到 ngClass 语法的任何问题，即使我尝试像这样硬编码 [ngClass]="['first']"，仍然会遇到同样的错误。

这个控制台错误不是用 ng serve 抛出并且工作正常，只在 prod 中发生。

Answer 1

如果您使用条件来确定 class，您应该使用不同的语法，如下所示：

[ngClass]="{'first': true, 'second': true, 'third': false}"

示例：

[ngClass]="{'checked': rating > 0}"

https://angular.io/api/common/NgClass

Answer 2

我正在用 maven 构建我的项目，我的项目名称是 <name>Dev Portal</name>。它包含一个space。此项目名称正在添加为属性。并且属性不能包含 space.

<!--bindings={
  "ng-reflect-Dev Portal": "true"
}-->

从名称中删除 space 解决了问题<name>DevPortal</name> 对于 Angular 9，此行为不存在。

无法在 'Element' 上执行 'setAttribute'：Angular 11

Failed to execute 'setAttribute' on 'Element': Angular 11

html

ng-class

angular

angular10

angular11