Checkie for AngularJS
An AngularJS directive that checks against a minimum Internet Explorer version before including content.
What does Checkie do?
Checkie is a simple directive to do a check to see if the browser is:
- Internet Explorer
- The Internet Explorer version is less than 9 (default) or the user specified version via the
This directive can wrap any content you may wish to not include for old browsers, from navigation elements, to your ng-view (See Usage below).
There are two easy ways to install the checkie directive:
To install via Bower, run:
checkie.directive.js folder, and include it in your index.html file with something like:
Also be sure to include the module in your app.js file with:
To use the checkie directive, wrap some content in either a
<checkie> tag, or via attribute for older browsers. This will check and not include the wrapped content if the browser is a version of Internet Explorer less than 9 (the default check value). e.g.
By default, the above will hide the content and leave a message of "You're using Internet Explorer [the ie version], please update your browser.". This is great for full page hides, but not great if hiding small elements, so you can override this with the
checkie-message attribute (see Custom checkie message).
To hide your entire apps view from old browsers:
Custom Internet Explorer version checkdate
By default, checkie will look for Internet Explorer 8 and below, but if you want to change that, you can do that via the
Custom checkie message
You may want to display a message to the user of the old browser, this can be done via the
Checkie comes with a debug tag to test the functionality and visibility of elements. To simulate an Internet Explorer version add the
checkie-debug tag and give a version to check:
The above pretends the browser is Internet Explorer 6 and processes it accordingly.
The checkie directive will wrap your content in a div with the classes:
This should allow you to style the checkie directive as you need on older browsers.
This directive spawned from @padolsey's gist and it's associated discussion: https://gist.github.com/padolsey/527683
MIT, free to use in personal and commercial projects.