Question

有关引导进度条的文档说明了如何显示具有默认值和完成值的进度条，但现在如何更新它？那么，更新值和宽度的最简单方法是什么？

这是我在home.html中的进度条：

<div class="progress">
    <div id="trainingProgressBar" class="progress-bar 
        progress-bar-success progress-bar-striped active" 
        role="progressbar" 
        aria-valuenow="40" aria-valuemin="0" 
        aria-valuemax="100" style="width:40%">
        {{trainingProgress}}% Complete
    </div>
</div>

在我的home.ts文件中，我声明了我的trainingProgress值：

public trainingProgress: number = 10;

文本将更改为trainingProgress，但宽度不会因为trainingProgress没有链接到aria-valuenow和width:%。

Answer 1

使用attribute和style绑定：

@interface MyProvider : NSObject <AWSIdentityProviderManager>
@property (nonatomic, copy) NSDictionary<NSString *, NSString *> * _Nullable tokens;
- (nonnull instancetype)initWithTokens:(NSDictionary<NSString *, NSString *> * _Nonnull)tokens OBJC_DESIGNATED_INITIALIZER;
- (AWSTask * _Nonnull)logins;
@end

这里是PLUNKER

Answer 2

您需要使用html中的style标记将宽度设置为trainingProgress。

看起来应该是这样的：

<div class="progress">
    <div id="trainingProgressBar" class="progress-bar 
        progress-bar-success progress-bar-striped active" 
        role="progressbar" 
        aria-valuemin="0" 
        aria-valuemax="100" style={{'width': trainingProgress + '%'}}>
        {{trainingProgress}}% Complete
    </div>
</div>

如何更新引导进度条。

2 个答案: