티스토리 뷰

Programming language/Angularjs(1.x)

angular toastr

hello-world 2017. 1. 24. 21:00
728x90
반응형

간단한 알림창~ 

좋네~


github: https://github.com/Foxandxss/angular-toastr


demo: http://codeseven.github.io/toastr/demo.html


- bower 로 설치

bower install angular-toastr

- npm 으로 설치

npm install angular-toastr




1. success

app.controller('foo', function($scope, toastr) {
  toastr.success('Hello world!', 'Toastr fun!');
});


2. info

app.controller('foo', function($scope, toastr) {
  toastr.info('We are open today from 10 to 22', 'Information');
});


3. error

app.controller('foo', function($scope, toastr) {
  toastr.error('Your credentials are gone', 'Error');
});


4. warning

app.controller('foo', function($scope, toastr) {
  toastr.warning('Your computer is about to explode!', 'Warning');
});


5. no title

app.controller('foo', function($scope, toastr) {
  toastr.success('I don\'t need a title to live');
});


Closing toasts programmatically:

app.controller('foo', function($scope, toastr) {
  toastr.clear([toast]);
});



커스터 마이징~


app.config(function(toastrConfig) {
  angular.extend(toastrConfig, {
    autoDismiss: false,
    containerId: 'toast-container',
    maxOpened: 0,    
    newestOnTop: true,
    positionClass: 'toast-top-right',
    preventDuplicates: false,
    preventOpenDuplicates: false,
    target: 'body'
  });
});


728x90
반응형
댓글