Angular: Empty Fiddle

http://angularjs.org/

by whroman

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.7/angular.min.js"></script>
<div ng-app="myApp">
  <div ng-app="myApp">
    <div ng-controller="myCtrl">
        
        <div>Note how typically-falsey values yield different results.</div>
        
        <br>

      <div ng-attr-dragable="{{true}}">
        <span ng-non-bindable>`true` Case: (`dragable="true"`)</span>
      </div>

      <div ng-attr-dragable="{{false}}">
        <span ng-non-bindable>`false` Case: (`dragable="false"`)</span>
      </div>

      <div ng-attr-dragable="{{null}}">
        <span ng-non-bindable>`null` Case: (`dragable`)</span>
      </div>

      <div ng-attr-dragable="{{''}}">
        <span ng-non-bindable>"" Case: (`dragable`)</span>
      </div>

      <div ng-attr-dragable="{{1}}">
        <span ng-non-bindable>`1` Case: (`dragable="1"`)</span>
      </div>

      <div ng-attr-dragable="{{0}}">
        <span ng-non-bindable>`0` Case: (`dragable="0"`)</span>
      </div>

      <div ng-attr-dragable="{{undefined}}">
        <span ng-non-bindable>`undefined` Case: (No attr is set)</span>
      </div>

    </div>
  </div>
</div>

CSS

[dragable] {
    color: red;
}

[dragable=true] {
    color: blue;
}

[dragable=false] {
    color: green;
}

[dragable="1"] {
    color: rgb(255,0,255);
}

[dragable="0"] {
    color: rgb(0,255,255);
}

JavaScript

angular
.module('myApp',[])
.controller('myCtrl', ["$scope", function () {}]);