msanjaypandit · January 6, 2017 08:58
diff --git a/Angular-1-input-model.html b/Angular-1-input-model.html
 <!doctype html>
 <html>

    <head>
        <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script>
    </head>

    <body>AngularJS directives are used to extend HTML. These are special attributes starting with ng- prefix. We're going to discuss following directives
        <div id="App1" ng-app = "myapp1" ng-controller = "HelloController1">
            <h3> Instant type your name </h3>
            <label>Name:</label>
            <input type = "text" ng-model = "yourName" placeholder = "Enter a name here">     
            <span style="padding-left:20px; font-size:18px;">Hello {{yourName}}!</span>
            <span style="padding-left:20px; font-size:18px;">Hello {{yourName| uppercase}}! (In uppercase)</span>
            <span style="padding-left:20px; font-size:18px;">Hello {{yourName| lowercase}}! (In lowercase)</span>
            <hr />
            <label>Quantity:</label>
            <input type = "text" ng-model = "yourCurrency" placeholder = "Enter a value here">
            <span style="padding-left:20px; font-size:18px;">Hello {{yourCurrency| currency}}! (In currency)</span>
            <label>Quantity:</label>
            <hr />
            <label>Technology:</label>
            <input type = "text" ng-model = "yourTech" placeholder = "Enter a Technology here"> (Filter and Order by)
            <span style="padding-left:20px; font-size:18px;">
                <ul>
                    <li ng-repeat = "technology in dev.technology| filter: yourTech |orderBy:'users'">
                        {{ technology.name + ', marks:' + technology.users }}
                    </li>
                </ul></span>
        </div>
        <hr />

    </body>
    <script>
                        var tuts1 = angular.module("myapp1", [])

                        tuts1.controller('HelloController1', function ($scope) {
                            $scope.dev = {
                                technology: [
                                    {name: 'php', users: 7},
                                    {name: 'html', users: 8},
                                    {name: 'angular', users: 5}
                                ],
                                fullName: function () {
                                    var devObject;
                                    devObject = $scope.dev;
                                    return devObject.firstName + " " + devObject.lastName;
                                }
                            };
                        });
    </script>
 </html>
	<!doctype html>
	<html>

	<head>
	<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.9/angular.min.js"></script>
	</head>

	<body>AngularJS directives are used to extend HTML. These are special attributes starting with ng- prefix. We're going to discuss following directives
	<div id="App1" ng-app = "myapp1" ng-controller = "HelloController1">
	<h3> Instant type your name </h3>
	<label>Name:</label>
	<input type = "text" ng-model = "yourName" placeholder = "Enter a name here">
	<span style="padding-left:20px; font-size:18px;">Hello {{yourName}}!</span>
	<span style="padding-left:20px; font-size:18px;">Hello {{yourName\| uppercase}}! (In uppercase)</span>
	<span style="padding-left:20px; font-size:18px;">Hello {{yourName\| lowercase}}! (In lowercase)</span>
	<hr />
	<label>Quantity:</label>
	<input type = "text" ng-model = "yourCurrency" placeholder = "Enter a value here">
	<span style="padding-left:20px; font-size:18px;">Hello {{yourCurrency\| currency}}! (In currency)</span>
	<label>Quantity:</label>
	<hr />
	<label>Technology:</label>
	<input type = "text" ng-model = "yourTech" placeholder = "Enter a Technology here"> (Filter and Order by)
	<span style="padding-left:20px; font-size:18px;">
	<ul>
	<li ng-repeat = "technology in dev.technology\| filter: yourTech \|orderBy:'users'">
	{{ technology.name + ', marks:' + technology.users }}
	</li>
	</ul></span>
	</div>
	<hr />

	</body>
	<script>
	var tuts1 = angular.module("myapp1", [])

	tuts1.controller('HelloController1', function ($scope) {
	$scope.dev = {
	technology: [
	{name: 'php', users: 7},
	{name: 'html', users: 8},
	{name: 'angular', users: 5}
	],
	fullName: function () {
	var devObject;
	devObject = $scope.dev;
	return devObject.firstName + " " + devObject.lastName;
	}
	};
	});
	</script>
	</html>