title: How to display a hidden element in AngularJS?
body: <p>Is it possible to have an element hidden by default (so that it does not show if JavaScript is off) and have AngularJS override the style to display it?</p>
  
  <p>I have a function on the scope that should be returning an overriding style to display the element:</p>
  
  <pre><code>$scope.style = function() {
    return { "display": "block!important" };
  }
  </code></pre>
  
  <p>The element itself has the original CSS hiding it as well as an <code>ng-style</code> directive:</p>
  
  <pre><code>&lt;h4 class="original" ng-style="style()"&gt;
  </code></pre>
  
  <p>The CSS hides the element at first:</p>
  
  <pre><code>.original {
    display: none;
  }
  </code></pre>
  
  <p>There is a non-working <a href="http://plnkr.co/edit/cpsrZijG26DbGUyikswF" rel="nofollow">demo here</a>.</p>