solution • AngularJS’s «ng» tips & tricks - martindubenet/wed-dev-design GitHub Wiki
Partial JavaScript code reference for all following examples.
binding: {
displayPageTitle: '@'
}
Short and clean for simple conditions based on a boolean (true VS false) question.
<article displayed-as-row="true">
Using "true"
is subjective. It could be anything within those double-quotes, as long as there is something. Empty double-quotes ""
= false
<h1 class="heading" ng-class="{'page-title not-page-title': $ctrl.displayPageTitle}>...</h1>
- If parameter is defined, css =
h1.heading.page-title
. - If parameter NOT defined, css =
h1.heading.not-page-title
.
<section class="header" ng-if="$ctrl.displayPageTitle !== undefined">
<h1>...</h1>
</section>
Using either ng-if or ng-show in the DOM will manage the visibility of the HTML block that it is applied on.
This binding class gets printed in the DOM simply to indicate that Angular generated some binding in there. This class is NOT to be used for CSS styling.