অ্যাঙ্গুলারজেএস

<!DOCTYPE html>
<html lang="en" ng-app="app">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.3/angular.min.js"></script>
<body ng-controller="control">

<button ng-click="execute('div')">ক্লিক করুন</button>

<div>
  <h1>প্রোগ্রামিং শিখুন</h1>
  <p>প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</p>
</div>

<script>
angular.module("app", [])
  .controller("control", function($scope) {

    $scope.execute = function(tag) {
      document.querySelector(tag).style.background = "pink";
    };

  });
</script>

</body>
</html>

<!DOCTYPE html>
<html lang="en" ng-app="app">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.3/angular.min.js"></script>
<body ng-controller="control">

<input
  ng-blur="blurred($event)"
  placeholder="ইনপুট ক্লিক করুন এবং তারপর বাইরে ক্লিক করুন">

<script>
angular.module("app", [])
  .controller("control", function($scope) {

    $scope.blurred = function(event) {
      event.target.style.background = "pink";
    };

  });
</script>

</body>
</html>

<!DOCTYPE html>
<html lang="en" ng-app="app">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.3/angular.min.js"></script>
<body ng-controller="control">

<select ng-model="color" ng-change="changed()">
  <option>লাল</option>
  <option>সবুজ</option>
  <option>নীল</option>
</select>

<p>{{color}}</p>

<script>
angular.module("app", [])
  .controller("control", function($scope) {

    $scope.changed = function() {
      $scope.message = $scope.color;
    };

  });
</script>

</body>
</html>

<!DOCTYPE html>
<html lang="en" ng-app="app">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.3/angular.min.js"></script>
<body ng-controller="control">

<p ng-copy="copied()">
  এই লেখাটি কপি করুন
</p>

<p>{{message}}</p>

<script>
angular.module("app", [])
  .controller("control", function($scope) {

    $scope.copied = function() {
      $scope.message = "লেখা কপি হয়েছে";
    };

  });
</script>

</body>
</html>

<!DOCTYPE html>
<html lang="en" ng-app="app">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.3/angular.min.js"></script>
<body ng-controller="control">

<input
  value="এই লেখাটি কাটুন"
  ng-cut="cutText()">

<p>{{message}}</p>

<script>
angular.module("app", [])
  .controller("control", function($scope) {

    $scope.cutText = function() {
      $scope.message = "লেখা কাটা হয়েছে";
    };

  });
</script>

</body>
</html>

<!DOCTYPE html>
<html lang="en" ng-app="app">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.3/angular.min.js"></script>
<body ng-controller="control">

<button ng-dblclick="execute('div')">ডাবল-ক্লিক করুন</button>

<div>
  <h1>প্রোগ্রামিং শিখুন</h1>
  <p>প্রোগ্রামিং শিখে নিজের ক্যারিয়ার গড়ে তুলুন</p>
</div>

<script>
angular.module("app", [])
  .controller("control", function($scope) {

    $scope.execute = function(tag) {
      document.querySelector(tag).style.background = "pink";
    };

  });
</script>

</body>
</html>

<!DOCTYPE html>
<html lang="en" ng-app="app">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.3/angular.min.js"></script>
<body ng-controller="control">

<input
  ng-focus="focused($event)"
  placeholder="এখানে ক্লিক করুন">

<script>
angular.module("app", [])
  .controller("control", function($scope) {

    $scope.focused = function(event) {
      event.target.style.background = "lightgreen";
    };

  });
</script>

</body>
</html>

<!DOCTYPE html>
<html lang="en" ng-app="app">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.3/angular.min.js"></script>
<body ng-controller="control">

<input
  ng-keydown="keyDown($event)"
  placeholder="press a key">

<p>{{message}}</p>

<script>
angular.module("app", [])
  .controller("control", function($scope) {

    $scope.keyDown = function(event) {
      $scope.message = event.key;
    };

  });
</script>

</body>
</html>

<!DOCTYPE html>
<html lang="en" ng-app="app">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.3/angular.min.js"></script>
<body ng-controller="control">

<input
  ng-keypress="keyPress($event)"
  placeholder="press a key">

<p>{{message}}</p>

<script>
angular.module("app", [])
  .controller("control", function($scope) {

    $scope.keyPress = function(event) {
      $scope.message = event.key;
    };

  });
</script>

</body>
</html>

<!DOCTYPE html>
<html lang="en" ng-app="app">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.3/angular.min.js"></script>
<body ng-controller="control">

<input
  ng-keyup="keyUp($event)"
  placeholder="একটি কী ছেড়ে দিন">

<p>{{message}}</p>

<script>
angular.module("app", [])
  .controller("control", function($scope) {

    $scope.keyUp = function(event) {
      $scope.message = + event.key;
    };

  });
</script>

</body>
</html>

<!DOCTYPE html>
<html lang="en" ng-app="app">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.3/angular.min.js"></script>
<body ng-controller="control">

<button
  ng-mousedown="pressed($event)"
  ng-mouseup="released($event)">
  {{message}}
</button>

<script>
angular.module("app", [])
  .controller("control", function($scope) {

    $scope.message = "ক্লিক করুন";

    $scope.pressed = function(event) {
      event.target.innerHTML = "চাপুন";
    };

    $scope.released = function(event) {
      event.target.innerHTML = "ছাড়ুন";
    };

  });
</script>

</body>
</html>

<!DOCTYPE html>
<html lang="en" ng-app="app">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.3/angular.min.js"></script>
<body ng-controller="control">

<div
  ng-mousemove="move($event)"
  style="height:100px; background:lightgray;">
  মাউস এখানে নিয়ে আসুন
</div>

<p>{{message}}</p>

<script>
angular.module("app", [])
  .controller("control", function($scope) {

    $scope.move = function(event) {
      $scope.message = event.clientX + ", " + event.clientY;
    };

  });
</script>

</body>
</html>

<!DOCTYPE html>
<html lang="en" ng-app="app">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.3/angular.min.js"></script>
<body ng-controller="control">

<div
  ng-mouseover="over($event)"
  style="padding:30px; background:lightgray;">
  মাউস ওপরে আনুন
</div>

<script>
angular.module("app", [])
  .controller("control", function($scope) {

    $scope.over = function(event) {
      event.target.style.background = "lightgreen";
    };

  });
</script>

</body>
</html>

<!DOCTYPE html>
<html lang="en" ng-app="app">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.3/angular.min.js"></script>
<body ng-controller="control">

<button
  ng-mousedown="pressed($event)"
  ng-mouseup="released($event)">
  {{message}}
</button>

<script>
angular.module("app", [])
  .controller("control", function($scope) {

    $scope.message = "ক্লিক করুন";

    $scope.pressed = function(event) {
      event.target.innerHTML = "চাপুন";
    };

    $scope.released = function(event) {
      event.target.innerHTML = "ছাড়ুন";
    };

  });
</script>

</body>
</html>

<!DOCTYPE html>
<html lang="en" ng-app="app">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.3/angular.min.js"></script>
<body ng-controller="control">

<input
  ng-paste="pasted()"
  placeholder="এখানে পেস্ট করুন">

<p>{{message}}</p>

<script>
angular.module("app", [])
  .controller("control", function($scope) {

    $scope.pasted = function() {
      $scope.message = "লেখা পেস্ট হয়েছে";
    };

  });
</script>

</body>
</html>

<!DOCTYPE html>
<html lang="en" ng-app="app">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.8.3/angular.min.js"></script>
<body ng-controller="control">

<form ng-submit="submitForm($event)">
  <input placeholder="নাম">
  <button>সাবমিট</button>
</form>

<p>{{message}}</p>

<script>
angular.module("app", [])
  .controller("control", function($scope) {

    $scope.submitForm = function(event) {
      event.preventDefault();
      $scope.message = "ফর্ম জমা দেওয়া হয়েছে";
    };

  });
</script>

</body>
</html>