Directive ng-bind in AngularJS make binding data to a element.
Run following code to know how it bind.
<html>
<head>
<title>ng_bin_singlepage</title>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.3.2/angular.min.js"></script>
<script>
angular.module('MyForm', [])
.controller('ExampleController', ['$scope', function ($scope) {
}]);
</script>
<style>
.my-input {
-webkit-transition: all linear 0.5s;
transition: all linear 0.5s;
background: transparent;
}
.my-input.ng-invalid {
color: white;
background: red;
}
</style>
</head>
<body ng-app="MyForm">
<form name="calForm" ng-controller="ExampleController">
<b>1. Using ng-bind </b>
<h5>Please input data </h5>
<input type="text" name="userName" ng-model="name" /><br />
<h5>Output text is :</h5>
<span ng-bind="name"></span>
<br />
<br />
<b>2. Not using ng-bind - get by model </b>
<h5>Input other data</h5>
<input type="text" name="userName1" ng-model="name1" /><br />
<h5>Text result is :</h5>
<span>{{name1}}</span>
</form>
</body>
</html>
No comments:
Post a Comment