Please note, this is a STATIC archive of website www.tutorialspoint.com from 11 May 2019, cach3.com does not collect or store any user information, there is no "phishing" involved.
Tutorialspoint

hello

<!doctype html>
<html ng-app>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.min.js"></script>
  </head>
  <body>
    <div>
      <label>Name:</label>
      <input type="text" ng-model="yourName" placeholder="Enter a name here">
      <hr>
      <h1>Hello {{yourName}}!</h1>
    </div>
  </body>
</html>

Online AngularJS Editor

<!doctype html>
<html ng-app>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.min.js"></script>
  </head>
  <body ng-app=" " ng-init="a=100">
      <input type="text" ng-model="a">
      <h1 ng-bind="a"></h1>
    
  </body>
</html>

Online AngularJS Editor

<html ng-app="notesApp">
<head><title>Notes App</title></head>
<body ng-controller="MainCtrl as ctrl">
<div>
<select ng-model="ctrl.selectedCountryId"
ng-options="c.id as c.label for c in ctrl.countries">
</select>
Selected Country ID : {{ctrl.selectedCountryId}}
</div>
<div>
<select ng-model="ctrl.selectedCountry"
ng-options="c.label for c in ctrl.countries">
</select>
Selected Country : {{ctrl.selectedCountry}}
<script
src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.19/angular.js">
</script>
<script type="text/javascript">
angular.module('notesApp', [])
.controller('MainCtrl', [function() {
this.countries = [
{label: 'USA', id: 1},
{label: 'India', id: 2},
{label: 'Other', id: 3}
];

}]);
</script>
</body>
</html>

Online AngularJS Editor

<!doctype html>
<html ng-app>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.min.js"></script>
  </head>
  <body>
    <div>
      <label>Name:</label>
      <input type="text" ng-model="yourName" placeholder="Enter a name here">
      <hr>
      <h1>Hello {{yourName}}!</h1>
    </div>
  </body>
</html>

Online AngularJS Editor

<!doctype html>
<html ng-app>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular-route.js"></script>
    <style>
        .header{
            width:800px;
            height : 80px;
            text-align:center;
            background-color:gray;
        }
        .footer{
            text-align:center;
            background-color:gray;
        }
        .leftMenu{
            background-color:gray;
            width:150px;
            height:500px;
        }
        .mainContent{
            height:500px;
            width:650px;
            background-color:gray;
        }
        a{
            display:block;
            padding:5px;
        }
    </style>
  </head>
  <body>
   
      <table border="1">
          <tr>
              <td colspan="2" class="header">
                Header
              </td>
          </tr>
          <tr>
              <td class="leftMenu">
                <a href="#/home">Home</a>
                <a href="#/cources">Cources</a>
                <a href="#/students">Students</a>
              </td>
              <td class="mainContent">
                  Main Content
              </td>
          </tr>
      </table>
    
  </body>
</html>

Online AngularJS Editor

<!doctype html>
<html >
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.min.js"></script>
  </head>
  <body>
 <html ng-app="myApp">
    <div   ng-controller="myCtrl">
        <input ng-model="FirstName" Placeholder="First Name">
        <input ng-model="LastName" placeholder="Last Name">
        Name: {{FirstName+" "+LastName}}
    </div>
        <div ng-controller="myCtrl2">
        <input ng-model="FirstName2" Placeholder="First Name">
        <input ng-model="LastName2" placeholder="Last Name">
        Name: {{FirstName2+" "+LastName2}}
    </div>
    <div ng-init="MyColor='red'" >
        <input  style="Background-color:{{MyColor}}" ng-bind="MyColor" >
    </div>
    <div ng-init="Quantity=5;Rate=2">
        Total Price:{{Quantity*Rate}}
        <br/>
        <span ng-bind="Quantity*Rate"></span>
    </div>
    <div ng-init="EmpDetails={Fname:'Anurag',LName:'Tidke'}">
        {{EmpDetails.Fname}}
    </div>
    <div ng-init="Numbers=[1,2,3,4,5,6]">
        {{Numbers[2]}}
    </div>
    <div ng-init="Names=['Anurag','Akshay','Nikhil']">
        <ul>
            <li ng-repeat="x in Names">
                {{x}}
            </li>
        </ul>
    </div>
    
    <div ng-controller="NewController">
        {{CarName}}
    </div>
    <div ng-app="NewApp" ng-controller="newController2">
        {{TestName}}
    </div>
</html>
  </body>
</html>

<script>
var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope) {
    $scope.FirstName= "John";
    $scope.LastName= "Doe";
});

app.controller('myCtrl2', function($scope) {
    $scope.FirstName2= "Anaya";
    $scope.LastName2= "Tidke";
});
app.controller('NewController',function($scope){
    $scope.CarName="Brezza";
});

var NewApp = angular.module('NewApp',[]);
NewApp.controller('NewController2',function($scope){
    $scope.TestName="New Test name";
    
});
</script>

file:///C:/Users/admin/Desktop/javascript/learn/js1.html

<!doctype html>
<html ng-app>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.min.js"></script>
  </head>
  <body>
    <div>
      <label>Name:</label>
      <input type="text" ng-model="yourName" placeholder="Enter a name here">
      <hr>
      <h1>Hello {{yourName}}!</h1>
    </div>
  </body>
</html>

hddd

<!doctype html>

<ul>
    <li><a routerLink="">Home</a></li>
    <li><a routerLink="about">About</a></li>
</ul>

<app-home></app-home>

<router-outlet></router-outlet>

Online AngularJS Editor

<!doctype html>
<html ng-app>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.3/angular.min.js"></script>
    <style>
    body{
    color:brown;
    margin:100px;
  font-family:  sans-serif;
    }
</style>
  </head>
  <body>
    <div>
      <label>Name:</label>
      <input ng-model="yourName" placeholder=" Enter a name here">
      <hr>
      <h1>Hello {{yourName}}!</h1>
      <label>I'm :</label>
      <input ng-model="filling"  placeholder=" happy, sad, excited...">
      <h2>Why are you {{filling}}?</h2>
    </div>
  </body>
</html>

Previous 1 ... 6 7 8 9 10 11 12 ... 64 Next
Advertisements
Loading...

We use cookies to provide and improve our services. By using our site, you consent to our Cookies Policy.