1. ホーム
  2. angular

angular-toaster 入坑记

2022-02-18 18:27:18

toaster是啥呢。是一款非常炫酷的提示插件,忍耐不住的人可以先去看特效。
不好的地方希望大家轻喷- -
去万能的npm官网,搜一下toaster就可以找到,这里介绍的是angular1*的toaster
安装方法我个人喜欢npm,万能的npm

npm install --save angularjs-toaster

npm安装也很简单,网上很多教程。

开始正题了首先我们通过引入文件来开始我们的项目


需要依赖angular-animate 注意咯~

最简单的一种,先推荐个在线编译的

http://plnkr.co/edit/?p=catalogue

官网的例子必须要自己写完整了才可以用,直接拿过来是不行的



      angular.module('main', ['toaster', 'ngAnimate'])
        .controller('myController', function($scope, toaster) {
            $scope.pop = function(){
                toaster.pop('success', "title", "text");
            };
        });
    
  

    
      
Hello Plunker!
      
Show a Toaster
<toaster-container></toaster-container>//这个指令放在当前页面就行,没有这个是没有特效的,他是特效的容器 toaster.pop('success', "title", "text");//这段代码就是特效产生的代码