Thursday, April 2, 2020

Add Cookies Alert with AngularJs

Html code
<div class="cookieinfo-flag" data-ng-if="cookie_flag" style="background: #ea5031; bottom: 0px; color: white; font-family: "verdana", "arial", sans-serif; font-size: 14px; height: auto; left: 0px; line-height: 21px; min-height: 21px; opacity: 1; padding: 8px 18px; right: 0px; text-align: left; z-index: 2147483647;">
  <div class="cookieinfo-close" data-ng-click="setCookieFlag()" style="background: #f1d600; border-radius: 5px; color: black; cursor: pointer; display: block; float: right; margin-left: 5px; min-width: 100px; padding: 5px 8px; text-align: center;">Got it!</div>
  >span style="display: block; padding: 5px 0 5px 0;">We use cookies to enhance your experience. By continuing to visit this site you agree to our use of cookies. <a href="https://wikipedia.org/wiki/HTTP_cookie/#" style="color: #f1d600; text-decoration: none;">More info</a></span>
</div>
Angular js code
var app = angular.module("myApp", []);  
app.controller("mainController", function($scope, $cookies) {
    /**
     * Check CookieFlag is set
     * if not then show flag alert (.cookieinfo-flag)
     */
    $scope.cookie_flag = true;
    if ($cookies.get('CookieFlag')) {
        $scope.cookie_flag = false;
    }
    /**
     * Set illusparkCookieFlag and hide flag alert (.cookieinfo-flag)
     */
    $scope.setCookieFlag = function() {
        $cookies.put('CookieFlag', true, {
            'expires': new Date('01/01/9999'),
            'path': '/'
        });
        $scope.cookie_flag = false;
    };

No comments:

Post a Comment