Ui网格角度表达式未按IE 11中的预期呈现
我试图使这个plunker Ui网格单元模板在大多数浏览器上都能工作，但在IE11中失败了。
指数html
<!DOCTYPE html>
<html ng-app="app">
<head>
<link data-require="bootstrap-css@*" data-semver="3.3.1" rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" />
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.js"></script>
<script data-require="ui-bootstrap@0.12.1" data-semver="0.12.1" src="http://angular-ui.github.io/bootstrap/ui-bootstrap-tpls-0.12.1.min.js"></script>
<script src="http://cdn.rawgit.com/angular-ui/ui-grid.info/gh-pages/release/3.0.0-rc.20/ui-grid.js"></script>
<link rel="stylesheet" href="http://cdn.rawgit.com/angular-ui/ui-grid.info/gh-pages/release/3.0.0-rc.20/ui-grid.min.css" type="text/css" />
<link rel="stylesheet" href="main.css" type="text/css" />
</head>
<body>
<div ng-controller="MainCtrl">
<div id="grid1" ui-grid="gridOptions" class="grid"></div>
</div>
<script src="app.js"></script>
</body>
</html>
数据json
[
{
"jobId": "1",
"loaded": 15000,
"error":6000,
"priced":5000
},
{
"jobId": "2",
"loaded": 15000,
"error":6000,
"priced":8000
}
]
状态emplate.html
<div class="progress">
<div class="progress-bar progress-bar-success" style="width:{{ (row.entity.priced/row.entity.loaded)*100|number:2}}% ;">
{{ (row.entity.priced/row.entity.loaded)*100|number:2}}%
</div>
<div class="progress-bar progress-bar-warning progress-bar-striped" style="width:{{ ((row.entity.loaded-row.entity.error-row.entity.priced)/row.entity.loaded)*100|number:2}}% ;">
{{ ((row.entity.loaded-row.entity.error-row.entity.priced)/row.entity.loaded)*100|number:2}}%
</div>
<div class="progress-bar progress-bar-danger" style="width:{{ (row.entity.error/row.entity.loaded) *100|number:2}}% ;">
{{ (row.entity.error/row.entity.loaded) *100|number:2}}%
</div>
</div>
app.js
var app = angular.module('app', ['ui.grid', 'ui.bootstrap']);
app.controller('MainCtrl', ['$scope', '$http', function ($scope, $http) {
$scope.gridOptions = {
columnDefs: [
{ name: 'jobId' },
{ name: 'status', cellTemplate: 'statusTemplate.html' }
]
};
$http.get('data.json')
.success(function (data) {
$scope.gridOptions.data = data;
});
}])
;
任何解释都非常感谢
使现代化
这适用于火狐，Safari和Chrome
共有1个答案
您可能遇到的问题之一是访问被拒绝。当脚本试图从当前页面的主机以外的源访问数据时，就会发生这种情况。检查此链接：https://msdn.microsoft.com/library/dn887953（v=vs.94）。aspx。检查此链接，了解如何禁用相同来源策略Internet Explorer。此外，您应该使用ng样式，而不是仅使用样式。这是一个砰的一声http://plnkr.co/edit/X2SROdoYsUJ1MKwkbNUQ?p=preview
<div class="progress">
<div class="progress-bar progress-bar-success" ng-style="{'width': (row.entity.priced/row.entity.loaded)*100 + '%' }">
{{(row.entity.priced/row.entity.loaded)*100|number:2}}%
</div>
<div class="progress-bar progress-bar-warning progress-bar-striped" ng-style="{'width': ((row.entity.loaded-row.entity.error-row.entity.priced)/row.entity.loaded)*100 + '%' }">
{{ ((row.entity.loaded-row.entity.error-row.entity.priced)/row.entity.loaded)*100|number:2}}%
</div>
<div class="progress-bar progress-bar-danger" ng-style="{'width': ((row.entity.error/row.entity.loaded)*100) + '%' }">
{{ (row.entity.error/row.entity.loaded) *100|number:2}}%
</div>
</div>
-
我使用的是角反应形式。在表单组的窗体控件中，我使用无法正常工作的正则表达式设置了验证器.模式，我不明白为什么。我已经验证了这个网站上的正则表达式 https://www.regextester.com/99144，以检查它，它工作正常 正则表达式（最少八个字符，至少一个大写字母，一个小写字母，一个数字和一个特殊字符） 这是表单组 因此，当我键入“World@20”时，它验证为真，但当我开始键入“W
-
我有元素，这些元素有一个绑定到复选框的语句。如果我物理地选中该复选框，将按预期响应。但是，如果我通过JavaScript选中或取消选中复选框，则复选框会按预期被选中或取消选中，但没有响应。这是正常工作吗？有没有更好的办法做到这一点？ 下面是我的代码示例：“[]”=“<>” HTML-第1部分 [li id=“HomeButton”ng-if=“HomeChecked！=true”onclick=“
-
问题内容： 我在Angular UI Grid中有一个项目列表。当我单击一行时，我想转到另一个页面。（换句话说，网格中的每一行都是一个链接。） 我想这肯定是一个非常普遍的愿望，尽管我还没有真正看到过有关如何实现的文档。什么是完成此任务的好方法？ 问题答案： 我自己想出了答案。这是我的控制器（ES6）： 这是我的行模板（Jade）： 另外，这是我的样式表（SCSS）。我认为突出显示光标下的行并使用光
-
问题内容： 我已经努力了两天才能使它正常工作，但我做不到（对正则表达式：S太糟糕了）。 从本文中，我需要检索两个不同的东西：和。为此，我创建了此正则表达式： 在该示例中，它可以工作。但是，如果我尝试其他文本：，则只会得到一个包含2个分组的匹配：和，而不是获得2个不同的匹配：一个具有分组和，另一个具有分组和。 我希望你能帮助我。 提前致谢。 问题答案： 这是为什么组合可能是邪恶的经典示例。请改用否定
-
我有一个有3列的网格。问题是第3列比其他两列更宽。都不是 网格-模板-列：重复（自动拟合,最小（33.33%,1fr))； 也不 网格自动列：33%； 工作，因为IE11不支持自动拟合和网格自动列。 在IE11中有没有替代的方法来实现这一点呢？多谢了。
-
问题内容： 我正在使用：https : //github.com/angular-ui/ui-grid.info/tree/gh- pages/release/3.0.0-RC.18 当我对值进行硬编码时，如上所示，网格扩展了，一切都按预期工作。 但是，如果我执行以下操作… 高度打印在div中，并且div变宽，但是内容本身仅扩大到340px左右。剩下的空间是空白的，所以我只看到8行，而不是25行。