徽章问题 - angular2-mdl 4.0.1 (Angular 4)

Question

我使用的徽章如下：

<mdl-icon [mdl-badge]="myCount" mdl-badge-overlap>some_icon</mdl-icon>

当 myCount:number 为 null 时，Angular 2 的 mdl 版本用于隐藏徽章。当前版本（带有 Angular 4 的 4.0.1）显示一个带有“null”文本的徽章。

但是 - a2MDL 页面上的示例（动态实验）工作正常 - 从输入框中删除数字时，徽章被隐藏。我错过了什么吗？

Answer 1

有趣！

版本 2 和 4 之间的变化是版本 2 使用了 Renderer 类中的 setElementAttribute：

this.renderer.setElementAttribute(this.el, 'data-badge', this.mdlBadgeContent);

Renderer 已弃用并由Renderer2 取代：

this.renderer.setAttribute(this.el, 'data-badge', this.mdlBadgeContent);

但是实现方式发生了变化： 版本 2：https://github.com/angular/angular/blob/2.4.x/modules/%40angular/platform-browser/src/dom/dom_renderer.ts#L199

版本 4 https://github.com/angular/angular/blob/92084f2b6a7cc1c81e31b8f413424223e62806d8/packages/platform-browser/src/dom/dom_renderer.ts#L148

如您所见，不再检查值是否存在。所以 null 值被隐式转换为字符串。

我创建了一个问题 (https://github.com/mseemann/angular2-mdl/issues/775) 来恢复旧行为，如果该值不存在，则会删除该属性。