জয়েন লগইন

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

🌈অ্যাঙ্গুলারজেএস কি?

📋অ্যাঙ্গুলারজেএস হলো মডিউল ইমপোর্ট ও পরিচালনা করার পদ্ধতি।

⚒️অ্যাঙ্গুলারজেএস মডিউল ইমপোর্ট ও পরিচালনা করতে ব্যবহৃত হয়।

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

অ্যাঙ্গুলারজেএস এবং সেগুলোর ব্যবহারের তালিকা

  • ➡️ controller - অ্যাপ্লিকেশনের কন্ট্রোলার তৈরি করা
  • ➡️ service - পুনর্ব্যবহারযোগ্য সেবা তৈরি করা
  • ➡️ factory - সেবা তৈরির ফ্যাক্টরি তৈরি করা
  • ➡️ provider - সেবা তৈরির প্রোভাইডার নির্ধারণ করা
  • ➡️ value - মান নির্ধারণ করা
  • ➡️ constant - ধ্রুবকের মান গ্রহণ করা
  • ➡️ directive - কাস্টম নির্দেশনা তৈরি করা
  • ➡️ component - পুনর্ব্যবহারযোগ্য কম্পোনেন্ট তৈরি করা
  • ➡️ config - অ্যাপ্লিকেশনের কনফিগারেশন তৈরি করা
  • ➡️ run - অ্যাপ্লিকেশন চালুর প্রক্রিয়া কার্যকর করা

controller - অ্যাপ্লিকেশনের কন্ট্রোলার তৈরি করার উদাহরণ।

angularjs
<!DOCTYPE html>
<html ng-app="app">
<body>

  <div ng-controller="app">
    {{header}}
  </div>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.8.3/angular.min.js"></script>
  <script>
    angular.module("app", [])

      .controller("app", function($scope) {
        $scope.header = "প্রোগ্রামিং শিখুন";
      });
  </script>

</body>
</html>

service - পুনর্ব্যবহারযোগ্য সেবা তৈরি করার উদাহরণ।

angularjs
<!DOCTYPE html>
<html ng-app="app">
<body>

  <div ng-controller="app">
    {{message}}
  </div>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.8.3/angular.min.js"></script>
  <script>
    angular.module("app", [])

      .service("message", function() {
        this.getMessage = function() {
          return "প্রোগ্রামিং শিখুন";
        };
      })

      .controller("app", function($scope, message) {
        $scope.message = message.getMessage();
      });
  </script>

</body>
</html>

factory - সেবা তৈরির ফ্যাক্টরি তৈরি করার উদাহরণ।

angularjs
<!DOCTYPE html>
<html ng-app="app">
<body>

  <div ng-controller="app">
    {{message}}
  </div>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.8.3/angular.min.js"></script>
  <script>
    angular.module("app", [])

      .factory("data", function() {
        return {
          getMessage: function() {
            return "প্রোগ্রামিং শিখুন";
          }
        };
      })

      .controller("app", function($scope, data) {
        $scope.message = data.getMessage();
      });
  </script>

</body>
</html>

provider - সেবা তৈরির প্রোভাইডার নির্ধারণ করার উদাহরণ।

angularjs
<!DOCTYPE html>
<html ng-app="app">
<body>

  <div ng-controller="app">
    {{message}}
  </div>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.8.3/angular.min.js"></script>
  <script>
    angular.module("app", [])

      .provider("message", function() {
        var text = "হ্যালো";

        this.setText = function(value) {
          text = value;
        };

        this.$get = function() {
          return {
            getMessage: function() {
              return text;
            }
          };
        };
      })

      .config(function(data) {
        data.setText("প্রোগ্রামিং শিখুন");
      })

      .controller("app", function($scope, message) {
        $scope.message = message.getMessage();
      });
  </script>

</body>
</html>

value - মান নির্ধারণ করার উদাহরণ।

angularjs
<!DOCTYPE html>
<html ng-app="app">
<body>

  <div ng-controller="app">
    {{message}}
  </div>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.8.3/angular.min.js"></script>
  <script>
    angular.module("app", [])

      .value("message", "প্রোগ্রামিং শিখুন")

      .controller("app", function($scope, message) {
        $scope.message = message;
      });
  </script>

</body>
</html>

constant - ধ্রুবকের মান গ্রহণ করার উদাহরণ।

angularjs
<!DOCTYPE html>
<html ng-app="app">
<body>

  <div ng-controller="app">
    {{message}}
  </div>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.8.3/angular.min.js"></script>
  <script>
    angular.module("app", [])

      .constant("message", "প্রোগ্রামিং শিখুন")

      .controller("app", function($scope, message) {
        $scope.message = message;
      });
  </script>

</body>
</html>

directive - কাস্টম নির্দেশনা তৈরি করার উদাহরণ।

angularjs
<!DOCTYPE html>
<html ng-app="app">
<body>

  <div ng-controller="app">
    <p></p>
  </div>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.8.3/angular.min.js"></script>
  <script>
    angular.module("app", [])

      .directive("p", function() {
        return {
          template: "<h2>প্রোগ্রামিং শিখুন</h2>"
        };
      })

      .controller("app", function() {});
  </script>

</body>
</html>

component - পুনর্ব্যবহারযোগ্য কম্পোনেন্ট তৈরি করার উদাহরণ।

angularjs
<!DOCTYPE html>
<html ng-app="app">
<body>

  <header></header>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.8.3/angular.min.js"></script>
  <script>
    angular.module("app", [])

      .component("header", {
        template: "<h2>প্রোগ্রামিং শিখুন</h2>"
      });
  </script>

</body>
</html>

config - অ্যাপ্লিকেশনের কনফিগারেশন তৈরি করার উদাহরণ।

angularjs
<!DOCTYPE html>
<html ng-app="app">
<body>

  <div ng-controller="app">
    {{header}}
  </div>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.8.3/angular.min.js"></script>
  <script>
    angular.module("app", [])

      .config(function() {
        console.log("মডিউল কনফিগার করা হয়েছে");
      })

      .controller("app", function($scope) {
        $scope.header = "প্রোগ্রামিং শিখুন";
      });
  </script>

</body>
</html>

run - অ্যাপ্লিকেশন চালুর প্রক্রিয়া কার্যকর করার উদাহরণ।

angularjs
<!DOCTYPE html>
<html ng-app="app">
<body>

  <div ng-controller="app">
    {{header}}
  </div>

  <script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.8.3/angular.min.js"></script>
  <script>
    angular.module("app", [])

      .run(function() {
        console.log("অ্যাপ্লিকেশন চালু হয়েছে");
      })

      .controller("app", function($scope) {
        $scope.header = "প্রোগ্রামিং শিখুন";
      });
  </script>

</body>
</html>

অ্যাঙ্গুলারজেএস সম্পর্কিত বিস্তারিত তথ্য

কার্যকর কোডিং উদাহরণ এবং সেগুলোর রেফারেন্স লিংক

নাম বিবরণ
controller অ্যাপ্লিকেশনের কন্ট্রোলার তৈরি করতে ব্যবহৃত হয়।
service পুনর্ব্যবহারযোগ্য সেবা তৈরি করতে ব্যবহৃত হয়।
factory সেবা তৈরির ফ্যাক্টরি তৈরি করতে ব্যবহৃত হয়।
provider সেবা তৈরির প্রোভাইডার নির্ধারণ করতে ব্যবহৃত হয়।
value মান নির্ধারণ করতে ব্যবহৃত হয়।
constant ধ্রুবকের মান গ্রহণ করতে ব্যবহৃত হয়।
directive কাস্টম নির্দেশনা তৈরি করতে ব্যবহৃত হয়।
component পুনর্ব্যবহারযোগ্য কম্পোনেন্ট তৈরি করতে ব্যবহৃত হয়।
config অ্যাপ্লিকেশনের কনফিগারেশন তৈরি করতে ব্যবহৃত হয়।
run অ্যাপ্লিকেশন চালুর প্রক্রিয়া কার্যকর করতে ব্যবহৃত হয়।