Schogini is Magento2 ready. Are you?

Get started with Magento 2 | Need expert Magento2 support?

AngularJs Directives

Date: 2015-11-03 | Category: AngularJS

1. ng-app

The ngApp directive designates the root element of the application and is typically placed near the root element of the page - e.g. on the <body>or <html> tags.

<html ng-app> or <body ng-app> or <div ng-app>

<html ng-app>
<title>AngularJS First Application</title>
<h4>Sample Application</h4>
   <p>First Name: <input type="text" ng-model="fname"></p>
   <p>Last Name: <input type="text" ng-model="lname"></p></p>
<script src=""></script>

2. ng-bind

Data binding in AngularJS synchronizes AngularJS expressions with AngularJS data. synchronized with ng-model="fname".

<p>First Name: <input type="text" ng-model="fname"></p>
<p>Last Name: <input type="text" ng-model="lname"></p>
<p>Full Name:  </p>
<p>Full Name: <span ng-bind="fname"></span> <span ng-bind="lname"></span></p>

3. ng-repeat

The ng-repeat directive repeats an HTML element

<div ng-app="" ng-init="names=[

  <li ng-repeat="x  in names">




  1. Convertion of Fahrenheit and Centigrade
<html ng-app>
<body ng-init>
    <h3>Conversion Calculator</h3>
    <p><input type="radio" ng-model="convert" value="Celsius">Celsius to Fahrenheit</p>
    <p><input type="radio" ng-model="convert" value="fahranheit">Fahrenheit to Celsius</p>
        <div ng-show="convert=='Celsius'">
            <p>Celsious : <input type="text" ng-model="cel"></p>
            <p>Faranheat : <input type="text" value=></p>
        <div ng-show="convert=='fahranheit'" >
            <p>Faranheat : <input type="text" ng-model="fah"></p>
            <p>Celsious : <input type="text" value=></p>
    <script src=""></script>

Schogini's customer service extends beyond the natural boundaries. ~ Timothy Johnson

Schogini assures 24x7 - 6 hour turn around ticket response time and 24 hour Email response time (