$new() or $rootScope.new() in angularjs

71 angularjs if else | ng if else | if else in AngularJs

In this blog post, I am going to share the code sample for AngularJs if else conditional expression.
Stayed Informed – Angular 2 ng-if else and Angular 2  ng-show

The AngularJs not provide the if(){}else{} functionality like others but we can achieve it by using the module. It is a collection of control flow directives i.e.
1.      ng-if
2.      ng-else-if and
3.      ng-else



Stayed Informed Get reliable managed cloud service provider for your IT infrastructure, on-premises or in the Cloud with support from class-leading experts, go to http://www.katalystpartners.com . Make your virtual machine more resilient with the latest Hyper–V virtual dedicated servers from Apps4Rent

Syntax:

<div ng-if="comp.code === 'CS'">
    {{comp.code}} - {{comp.name}}
</div>

Table of Contents
      1. AngularJs code-sample
      2. HTML 5 code-sample
      3. Full Example code sample

Go and explore live output link on plnker..

JavaScript Code Sample
var app = angular.module('myApp', []);
    app.controller('mainController', function($scope) {
      $scope.comp = {
        code: 'CS',
        name: 'code-sample.com'
      };
    });
HTML Code Sample
<div ng-app="myApp">
  <div ng-controller="mainController">
    <h2>ng-if else in angularjs</h2>
    <hr/>
    <div>
      <div ng-if="comp.code === 'CS'">
            {{comp.code}}-{{comp.name}}
      </div>
      <div ng-if="comp.code === '' ">
            http://www.code-sample.xyz/
      </div>
    </div>
  </div>
</div>

Full Code Sample (Angular + HTML)

<!DOCTYPE html>
<html>
<head>
  <script src="https://code.angularjs.org/1.4.12/angular.js"></script>
  <script>
    var app = angular.module('myApp', []);
    app.controller('mainController', function($scope) {
      $scope.comp = {
        code: 'CS',
        name: 'code-sample.com'
      };
    });
  </script>
</head>

<body ng-app="myApp">
  <div ng-controller="mainController">
    <h2>ng-if else in angularjs</h2>
    <hr/>
    <div>
      <div ng-if="comp.code === 'CS'">
        If code is = <span style="color:green;">{{comp.code}}</span> , than company is = <a href="http://www.{{comp.name}}">{{comp.name}}</a>
      </div>
      <div ng-if="comp.code === '' ">
        code-sample.xyz
      </div>
    </div>
    <br/>
    <hr/>
    <a href="http://www.code-sample.com/2011/11/angularjs-tutorial-step-by-step.html" traget="_blank">For more...</a>
  </div>
</body>

</html>





The live demo Output link..
ANIL SINGH

Hey! I'm Anil Singh. I author this blog. I'm Active Blogger, Programmer. I love learning new technologies, programming, blogging and participating the forum discussions more...
My Blogs - https://code-sample.com and https://code-sample.xyz
My Books - Interview Questions and Answers Books- Get Your Book in 15+ Digital Stores Worldwide..

You Might Also Like
Post a Comment
www.code-sample.com/. Powered by Blogger.
ASK Questions
SQL Server NodeJs TypeScript JavaScript Angular SQL Server My Book