我正在使用angular-toastr ，我想在 toastr 中有一个动态内容，比如说一个计数器，我如何在没有其他实例的情况下更新它。
这是我的 Angular 脚本:
// Code goes here
angular.module("myApp", ['toastr'])
.controller("myCtrl", myCtrl);
myCtrl.$inject = ["toastr"];
function myCtrl(toastr){
var vm = this;
vm.cont = 0;
vm.start = function(){
//I need create only one toastr with vm.cont update for each increment
toastr.info(vm.cont + " en espera", 'Transferencias y pagos', {
allowHtml: true,
extendedTimeOut: 0,
tapToDismiss: true,
timeOut: 0,
onHidden: vm.listWaitView
});
};
vm.increment = function(){
vm.cont++;
vm.start(); //function that trigger the toastr
};
}
我的看法:
<!DOCTYPE html>
<html ng-app="myApp">
<head>
<script data-require="<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="47262920322b2635692d3407766973697f" rel="noreferrer noopener nofollow">[email protected]</a>" data-semver="1.4.8" src="https://code.angularjs.org/1.4.8/angular.js"></script>
<link data-require="<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="badbd4ddcfd6dbc897ced5dbc9cec8fa8b9489948b" rel="noreferrer noopener nofollow">[email protected]</a>" data-semver="1.3.1" rel="stylesheet" href="https://rawgit.com/Foxandxss/angular-toastr/1.3.1/dist/angular-toastr.css" />
<script data-require="<a href="https://stackoverflow.com/cdn-cgi/l/email-protection" class="__cf_email__" data-cfemail="e4858a8391888596c9908b85979096a4d5cad7cad5" rel="noreferrer noopener nofollow">[email protected]</a>" data-semver="1.3.1" src="https://rawgit.com/Foxandxss/angular-toastr/1.3.1/dist/angular-toastr.tpls.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body ng-controller="myCtrl as ctrl">
<h1>Counter</h1>
<h2>{{ctrl.cont}}</h2>
<button ng-click="ctrl.increment();">Increment</button>
</body>
</html>
为了您的方便，我制作了一个简单的脚本，并上传到 plunkr 中:
示例:
最佳答案
您是否希望在创建新的 Toast 之前清除现有的 Toast。如果是，请尝试以下操作
toastr.clear();
toastr.info(vm.cont + " en espera", 'Transferencias y pagos', {
...
关于javascript - 如何将动态内容绑定(bind)到 Angular-toastr？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/35350944/