0
我開始學習使用angular的ui bootstrap庫並嘗試獲取popover工作。我在設置中丟失了什麼?角ui bootstrap popover不起作用
我提供了一個plunker示例。我的要求是在表格中的單元格上進行彈出操作,每秒刷新一次$ interval。
http://plnkr.co/edit/hF3EDIRfKA1VOfSennZq?p=preview
<!DOCTYPE html>
<html ng-app="test">
<head>
<meta charset="UTF-8">
<title>angular-test</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css" type="text/css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular-animate.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.14.2/ui-bootstrap-tpls.min.js"></script>
<script type="text/javascript">
var app = angular.module("test", ['ngAnimate', 'ui.bootstrap']);
app.controller("testCtrl", function($scope, $interval) {
var stats = [{
"name": "john",
"stat1": 3,
"stat2": 5
}];
var count = 0;
$scope.getTestInfo = function() {
$scope.count = count++;
$scope.stats = stats;
}
$interval(function(){$scope.getTestInfo();}, 1000);
});
</script>
</head>
<body>
<div class="container-fluid">
<div class="row">
<div class="col-lg-4" ng-controller="testCtrl" ng-init="count=0">
<table id="table1" class="table table-hover table-condensed">
<thead>
<tr>
<th>column1</th>
<th>column2</th>
<th>column3</th>
</tr>
</thead>
<tbody class="bg-info">
<tr ng-repeat="stat in stats">
<td uib-popover="testcolumn1">{{stat.name}}</td>
<td uib-popover="{{stat.stat1}}">{{stat.stat1 + count}}</td>
<td uib-popover="testcolumn3">{{stat.stat2}}</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</body>
</html>
謝謝!這絕對解決了我的掠奪者例子,並且完全按照我想要的方式工作。但是當我在我的應用程序上嘗試它時,每次調用$ interval時,popover似乎都在「閃爍」。這裏是我的應用程序的精簡版。我已經把它放在重擊器中,如果你把鼠標懸停在錯誤單元格上,你會看到彈出式消音器.. http://plnkr.co/edit/g68EEdC8Wq5eFPQG2ciG?p=preview – bobby
你的'var stats'在頂部的腳本不在角度名稱空間之內。直接將包含在該變量中的數組賦值給'$ scope'(這正是你應該做的事情),解決了這個問題。在你的例子中,http://plnkr.co/edit/KDsE4GPEhwTpubEcq5jK?p=preview –
,你是否改變了沉睡者?你能提供一個例子嗎? – bobby