它可以正常工作,但在 ngClick 后不起作用。
- 这是为什么?
- 如果您确实希望它在 ngClick 之后工作,应该如何处理?
它实际上在下面的代码片段中有效,但在这个 Plunker 中不起作用,并且在我的应用程序中也不起作用。
它在这三个地方的任何一个都只能工作一次,我不知道为什么。
angular
.module('app', ['ui.bootstrap'])
.controller('MainController', MainController)
;
function MainController() {
var vm = this;
vm.updateSuccess = false;
vm.closeUpdateSuccess = function() {
console.log('closeUpdateSuccess');
vm.updateSuccess = false;
};
vm.submit = function() {
vm.updateSuccess = true;
};
}
<!DOCTYPE html>
<html ng-app='app'>
<head>
<link data-require="<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="dab8b5b5aea9aea8bbaaf7b9a9a99ae9f4ebf4eb" rel="noreferrer noopener nofollow">[email protected]</a>" data-semver="3.1.1" rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" />
<script data-require="<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="bcddd2dbc9d0ddce92d6cffc8d9288928f" rel="noreferrer noopener nofollow">[email protected]</a>" data-semver="1.4.3" src="https://code.angularjs.org/1.4.3/angular.js"></script>
<script data-require="<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="b8cdd195dad7d7cccbcccad9c8f88896898b968b" rel="noreferrer noopener nofollow">[email protected]</a>" data-semver="0.13.3" src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.13.3/ui-bootstrap.min.js"></script>
<script src='https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.13.4/ui-bootstrap-tpls.min.js'></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body>
<div ng-controller='MainController as vm'>
<alert ng-show='vm.updateSuccess' type='success' close='vm.closeUpdateSuccess()' dismiss-on-timeout='2000'>
Successfully updated!
</alert>
<h1>Test Text</h1>
<button ng-click='vm.submit()'>Submit</button>
</div>
</body>
</html>
最佳答案
问题是您没有正确使用 alert
指令。它正在按设计工作,您可以通过查看浏览器中的控制台来看到这一点。当页面呈现时,两秒后您的日志记录语句将被执行。 alert
指令不知道也不关心它是否可见。当指令被添加到 DOM 时,Angular 将执行该指令。对于您正在使用的 ng-show ,它仅添加一次。您可以使用 ng-if 来实现所需的行为,或者,正如我下面所说,如果您希望能够显示多个警报,则可以使用 ng-repeat。
看看我们的例子 here并了解我们如何使用数组来存储它们以及如何使用 HTML 代码通过 ng-repeat 来显示它们。
关于angularjs - 为什么在 ngClick 之后,missing-on-timeout 不适用于 ui-bootstrap 的警报指令?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32982806/