移除初始进度条显示答案

【问题标题】：Remove initial progress bar display移除初始进度条显示
【发布时间】：2017-10-17 15:29:44
【问题描述】：

你能告诉我如何删除进度条的初始显示值，即使它显示的值为0？这似乎是 CSS 问题。但还没有解决它的运气。

运行时 CSS：

.scss

 .progress-outer {
            width: 96%;
            margin: 10px 2%;
            padding: 3px;
            text-align: center;
            background-color: #f4f4f4;
            border: 1px solid #dcdcdc;
            color: #fff;
            border-radius: 20px;
        }
        .progress-inner {

            white-space: nowrap;
            overflow: hidden;
            padding: 5px;
            border-radius: 20px;
            background-color: map-get($colors, primary);
        }

.html

 <progress-bar [progress]="loadProgress"></progress-bar>

.ts

loadProgress: string = '';

我已经使用this article 来创建组件。

【问题讨论】：

放一个简单的*ngIf 不能解决这个问题？ <progress-bar [progress]="loadProgress" *ngIf="loadProgress > 0"></progress-bar>.
loadProgress 是 string 变量号吗？ @developer033
我不知道，是吗？ :) 它来自哪里？
这里<div class="progress-inner" [style.width]="progress + '%'">。如果您看到上面提到的文章，您可以了解更多信息。@developer033
不，我的意思是你从另一个组件调用它，对吧？那么，loadProgress 变量是如何定义的？

标签： css angular sass ionic2 ionic3

【解决方案1】：

如果进度条是您自己的自定义组件，则将 *ngIf 用于进度内部 div，或者您甚至可以在进度为零时对其使用 [hidden]。

如果它不是您自己的自定义组件，您可能需要使用 ElementRef 来操作 .ts 文件中的内部 div 以隐藏它。

【讨论】：

好建议。我会尝试并告诉你。组件是我的。