ui.bootstrap使< progress>变形. HTML标签 [英] ui.bootstrap deforms the <progress> HTML tag

问题描述

在我的HTML文件中，我有一个<progress>标记，并且还将ui.bootstrap依赖项注入到控制器中，如下所示:

In my HTML file I have a <progress> tag and I also injected the ui.bootstrap dependency to my controller as follows:

var myApp = angular.module("myApp",["ui.bootstrap"]);

在此配置中，AngularJS将<progress></progress>转换为:

In this configuration, AngularJS converts the <progress></progress> into:

<div class="progress ng-isolate-scope" ng-transclude=""></div>

当我删除"ui.bootstrap"时，它可以正常工作.您可以使用此示例JSFiddle进行播放.

When I remove "ui.bootstrap" it works fine. You can play out with this sample JSFiddle.

当progress变成<div class="progress ng-isolate-scope" ng-transclude=""></div>时 它消失了.我了解ui.bootstrap中有一个名为progress的指令可以进行这种转换.

When progress turned into <div class="progress ng-isolate-scope" ng-transclude=""></div> it disappears. I understand that there is a directive called progress in ui.bootstrap that makes this conversion.

那么，如何使此进度条起作用?或者，如何在不删除依赖项的情况下禁用angular-ui的progress指令?

So, how can I make this progress bar work? Or, how can I disable the progress directive of angular-ui without removing the dependency?

谢谢.

推荐答案

我只是遇到了同样的问题.一个简单的解决方法是使用ng-non-bindable，这是标准的angualr指令.缺点是您不能在progress元素内使用任何角度指令或绑定.

I just ran into this same issue. A simple workaround is to use ng-non-bindable which is a standard angualr directive. The drawback is you can't use any angular directives or bindings within the progress element.

<progress ng-non-bindable></progress>

这篇关于ui.bootstrap使< progress>变形. HTML标签的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！