আমি কৌণিক প্রতিটি কন্ট্রোলারে একটি ফাংশন উপলব্ধ করতে পারি?


191

আমার যদি এমন কোনও ইউটিলিটি ফাংশন থাকে fooযা আমি আমার ng-appঘোষণার ভিতরে যে কোনও জায়গা থেকে কল করতে সক্ষম হতে চাই । আমি কি কোনওভাবেই এটি আমার মডিউল সেটআপে বিশ্বব্যাপী অ্যাক্সেসযোগ্য করতে পারি বা প্রতিটি কন্ট্রোলারের মধ্যে আমার এটিকে যুক্ত করার দরকার আছে?


আমি এটি সম্পর্কে 100% নিশ্চিত নই, তবে আপনার মডিউলে এটির মতো এটির সংজ্ঞা দেওয়ারও একটি সুযোগ রয়েছে: module.value('myFunc', function(a){return a;});এবং তারপরে এটি আপনার কন্ট্রোলারে নাম দিয়ে ইনজেক্ট করুন। (যদি কোনও পরিষেবা করা এড়াতে চায়)
ব্যবহারকারী 2173353

এর অর্থ হ'ল আমাকে নিজেই প্রতিটি নিয়ামকের সাথে এটি যুক্ত করতে হবে। 2 রুটস্কোপটি আমি প্রায় 2 বছর আগে যা করতে চেয়েছিলাম তার জন্য যাওয়ার উপায় =)
লুডভিগ ম্যাগনুসন

ঠিক আছে. :) আমি কেবল সরল নিয়ন্ত্রকদের চেয়ে বিচ্ছিন্ন সুযোগ সহ আরও বেশি বার নির্দেশিকা ব্যবহার করি এবং যাইহোক আমাকে সবকিছুই ইনজেক্ট করতে হয়। আমি এটি সরবরাহ করে মডিউলার কোড শৈলী পছন্দ করি। এছাড়াও, আপনাকে কোনওভাবেই প্যারেন্টস স্কোপগুলির সাথে ঝামেলা করতে হবে না এবং আপনার স্কোপ ভেরিয়েবলগুলি কোথা থেকে আসে তার জন্য আপনাকে খুব বেশি অনুসন্ধান করতে হবে না। :)
ব্যবহারকারী 21733533

উত্তর:


290

আপনার কাছে মূলত দুটি বিকল্প রয়েছে, হয় এটি পরিষেবা হিসাবে সংজ্ঞায়িত করুন, বা এটি আপনার মূল সুযোগে রাখুন। আমি আপনাকে পরামর্শ দিচ্ছি যে আপনি মূল সুযোগকে দূষিত করা এড়াতে কোনও পরিষেবা তৈরি করুন। আপনি একটি পরিষেবা তৈরি করুন এবং এটি আপনার নিয়ামকটিতে এটি উপলভ্য করুন:

<!doctype html>
<html ng-app="myApp">
<head>
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://code.angularjs.org/1.1.2/angular.min.js"></script>
    <script type="text/javascript">
    var myApp = angular.module('myApp', []);

    myApp.factory('myService', function() {
        return {
            foo: function() {
                alert("I'm foo!");
            }
        };
    });

    myApp.controller('MainCtrl', ['$scope', 'myService', function($scope, myService) {
        $scope.callFoo = function() {
            myService.foo();
        }
    }]);
    </script>
</head>
<body ng-controller="MainCtrl">
    <button ng-click="callFoo()">Call foo</button>
</body>
</html>

যদি এটি আপনার পক্ষে বিকল্প না হয় তবে আপনি এটির মতো মূল স্কোপটিতে এটি যোগ করতে পারেন:

<!doctype html>
<html ng-app="myApp">
<head>
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://code.angularjs.org/1.1.2/angular.min.js"></script>
    <script type="text/javascript">
    var myApp = angular.module('myApp', []);

    myApp.run(function($rootScope) {
        $rootScope.globalFoo = function() {
            alert("I'm global foo!");
        };
    });

    myApp.controller('MainCtrl', ['$scope', function($scope){

    }]);
    </script>
</head>
<body ng-controller="MainCtrl">
    <button ng-click="globalFoo()">Call global foo</button>
</body>
</html>

এইভাবে, আপনার সমস্ত globalFoo()টেমপ্লেটগুলি কন্ট্রোলারের কাছ থেকে টেমপ্লেটে পাস না করে কল করতে পারে।


5
প্রথম সমাধানে, যদি টন foo()ফাংশন হয়? $scope.callFoo()তাদের প্রত্যেকের জন্য একটি মোড়ক তৈরি করা খুব বেশি কাজ। আমি কোনও লাইব্রেরির সমস্ত ফাংশনকে স্কোপে "সংযুক্ত" করব কীভাবে এটি টেমপ্লেটে ব্যবহার করা যেতে পারে? আমার কাছে একটি বড় ইউনিট রূপান্তর গ্রন্থাগার রয়েছে যা আমি এটি চাই যে এটি আমার টেমপ্লেটে উপলভ্য হোক।
অ্যালেক্সস্ট্যাক

3
আমার প্রশ্নও। আমি এটি চেষ্টা করে দেখেছি এবং এটি কাজ করে: আপনি যে $scope.callFoo = myService.foo;জায়গাতে এটি ব্যবহার করতে চান সেখানে নতুন করে মোড়ক তৈরি করার জায়গায় আপনি এটি "সংযুক্ত" করতে পারেন।
ফিটার ম্যান

1
আপনার সহায়তার জন্য ধন্যবাদ, আমি ভাবছিলাম যে আমার অ্যাপ্লিকেশন জুড়ে কীভাবে পরিবর্তিত ভাষার ফাংশন উপলব্ধ করা যায় এবং $ রুটস্কোপ কাজটি করে। আমি অনুবাদ মডিউলটি অ্যাপ্লিকেশন থেকে আলাদা রাখতে চেয়েছিলাম যাতে আমি এটিকে অন্য অ্যাপগুলিতেও প্লাগ করতে পারি।
পাওলো পেদ্রোসো

যদি আপনি কোনও পরিষেবার মধ্যে একাধিক ফাংশন রাখার পরিকল্পনা না করেন তবে আমি এই নির্দিষ্ট ক্ষেত্রে কারখানার চেয়ে কৌণিক মানটি ব্যবহার করার পরামর্শ দেব। যদি এটি শুধুমাত্র একটি ফাংশন হয় তবে এটিকে একটি মান করুন।
নিকোলাস ব্লেজেন

আমি ত্রুটি পেয়েছি: [ject ইনজেক্টর: আনআরপি]
মার্ক থিয়েন

53

আপনি তাদের সমন্বয় করতে পারেন আমার ধারণা:

<!doctype html>
<html ng-app="myApp">
<head>
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
    <script src="http://code.angularjs.org/1.1.2/angular.min.js"></script>
    <script type="text/javascript">
        var myApp = angular.module('myApp', []);

        myApp.factory('myService', function() {
            return {
                foo: function() {
                    alert("I'm foo!");
                }
            };
        });

        myApp.run(function($rootScope, myService) {
            $rootScope.appData = myService;
        });

        myApp.controller('MainCtrl', ['$scope', function($scope){

        }]);

    </script>
</head>
<body ng-controller="MainCtrl">
    <button ng-click="appData.foo()">Call foo</button>
</body>
</html>

7
আমি মনে করি এটি সঠিক উত্তর হওয়া উচিত, @ প্রিয়মের উত্তর দ্বারা ন্যায়সঙ্গত। এটি 10 ​​টি বিভিন্ন নিয়ামককে কোনও পরিষেবা নির্ভরতা নির্দিষ্ট করে বোঝায় না।
jvannistelrooy

পরিষেবাটিতে কী এমন পদ্ধতি / ফাংশন অন্তর্ভুক্ত থাকতে পারে যা CRUD এর বৈশিষ্ট্যগুলি / ভেরিয়েবলগুলিতে করতে পারে $rootScope?
jezmck

44

যদিও প্রথম পদ্ধতির পক্ষে 'কৌণিকের মতো' পদ্ধতির মতামত দেওয়া হয়েছে, তবে আমি অনুভব করি যে এটি ওভারহেড যুক্ত করে।

আমি যদি 10 টি বিভিন্ন কন্ট্রোলারে এই myservice.foo ফাংশনটি ব্যবহার করতে চাই তা বিবেচনা করুন। আমাকে এই 'মাই সার্ভিস' নির্ভরতা এবং তারপরে দশটিতে স্কোপ.ক্যালফু স্কোপ সম্পত্তিটি নির্দিষ্ট করতে হবে। এটি কেবল একটি পুনরাবৃত্তি এবং কোনওভাবে DRY নীতি লঙ্ঘন করে।

যদিও আমি যদি $ রুটস্কোপ পদ্ধতির ব্যবহার করি তবে আমি এই গ্লোবাল ফাংশনটি গাবলফু কেবলমাত্র একবারে নির্দিষ্ট করেছি এবং এটি আমার ভবিষ্যতের সমস্ত নিয়ামকগুলিতে উপলব্ধ হবে, যতই হোক না কেন।


5
কন্ট্রোলারদের 'ডকুমেন্টিং'-তে কিছু মান থাকতে পারে যেখানে তারা সেই বিশ্বব্যাপী পরিষেবা কল পায়। আপনি যদি নিজের কন্ট্রোলারদের অন্য কোনও অ্যাপ্লিকেশনে ইঙ্ক করে থাকেন তবে বিশ্বব্যাপী ফাংশনটি কোথা থেকে এসেছে তা খুব কম স্পষ্ট হবে। আমি আপনার যুক্তি স্বীকৃতি শুনতে শুনতে।
ম্যাথু পেইন

আপনার যদি ভিউ থেকে কল করার প্রয়োজন হয় তবে এটি কেবল সুযোগের উপরে রাখা উচিত। নিয়ন্ত্রকটিতে, আপনি পরিষেবা থেকে সরাসরি এটি কল করতে পারেন।
এমসিভি

10
এটি একটি মন্তব্য নয় একটি উত্তর
এলিয়ট

$ রুটস্কোপ ভেরিয়েবলটি সর্বদা পৃষ্ঠা রিফ্রেশে নালায় যায় তবে আপনি ফাংশনটি পাবেন না। এজন্য পরিষেবাটি ইনজেক্ট করা এবং প্রয়োগের ক্ষেত্রে এর রেফারেন্সটি ব্যবহার করা ভাল।
এহসান হাফিজ

4

অ্যাঙ্গুলারজেগুলির কেবলমাত্র আপনার মতো সমস্যার জন্য " পরিষেবাদি " এবং " কারখানাগুলি " রয়েছে Control এগুলি নিয়ামক, নির্দেশিকা, অন্যান্য পরিষেবাদি বা অন্য কোনও কৌণিক উপাদানগুলির মধ্যে কিছু বিশ্বব্যাপী ব্যবহার করতে ব্যবহৃত হয় .. আপনি ফাংশন সংজ্ঞায়িত করতে পারেন, ডেটা সঞ্চয় করতে পারেন, গণনা ফাংশন করতে পারেন বা আপনি যা কিছু করতে পারেন পরিষেবাদিগুলির অভ্যন্তরে চান এবং এগুলারজেজে উপাদানগুলিতে গ্লোবাল। লাইক হিসাবে ব্যবহার করুন

angular.module('MyModule', [...])
  .service('MyService', ['$http', function($http){
    return {
       users: [...],
       getUserFriends: function(userId){
          return $http({
            method: 'GET',
            url: '/api/user/friends/' + userId
          });
       }
       ....
    }
  }])

যদি আপনার আরও প্রয়োজন হয়

আমাদের কেন AngularJs পরিষেবাদি এবং কারখানাগুলির প্রয়োজন তা সম্পর্কে আরও সন্ধান করুন


0

আমি কৌণিকের থেকে কিছুটা নতুন তবে আমি কী কার্যকর হতে পেরেছি (এবং বেশ সহজ) আমি একটি বিশ্বব্যাপী স্ক্রিপ্ট তৈরি করেছি যা স্থানীয় স্ক্রিপ্টের আগে আমি আমার পাতায় লোড করে দিয়েছি বৈশ্বিক ভেরিয়েবলগুলি যেভাবেই আমার সমস্ত পৃষ্ঠায় অ্যাক্সেস করতে হবে। সেই স্ক্রিপ্টে, আমি "গ্লোবাল ফাংশনস" নামে একটি বস্তু তৈরি করেছি এবং বিশ্বব্যাপী বৈশিষ্ট্য হিসাবে আমার অ্যাক্সেস করার জন্য প্রয়োজনীয় ফাংশনগুলি যুক্ত করেছি। যেমন globalFunctions.foo = myFunc();। তারপরে, প্রতিটি স্থানীয় স্ক্রিপ্টে, আমি লিখেছি $scope.globalFunctions = globalFunctions;এবং তাত্ক্ষণিকভাবে আমি বিশ্বব্যাপী স্ক্রিপ্টে গ্লোবাল ফাংশন অবজেক্টে যুক্ত হওয়া কোনও ফাংশনে অ্যাক্সেস পেয়েছি।

এটি একটি সামান্য কাজ এবং আমি নিশ্চিত যে এটি আপনাকে সহায়তা করে না তবে এটি অবশ্যই আমাকে সহায়তা করেছিল কারণ আমার অনেকগুলি কার্যকারিতা ছিল এবং প্রতিটি পৃষ্ঠায় সেগুলি সবগুলি যুক্ত করে ব্যথা হচ্ছিল।


1
আমি শুধু কৌতূহল করছি কেন ডাউনটা? আমি নতুন এবং ভাল থেকে জানতে চাই।
ইজজি

আমার কাছে একটি কাজের সমাধান বলে মনে হচ্ছে। আপনার সুযোগটি যথেষ্ট পরিমাণে বিচ্ছিন্ন কিনা তা নিশ্চিত করার জন্য আমি কেবলমাত্র একটাই পরামর্শ করব, তা হল একটি গ্লোবাল রুট জাভাস্ক্রিপ্ট ইউটিলিটি ক্লাস তৈরি করা এবং আপনার ইউটিলিটি পদ্ধতিগুলি বন্ধ করে দেওয়া যাতে আপনি দুর্ঘটনাক্রমে অন্য কোনও ফাংশন নামের উপর পদক্ষেপ না করেন is কৌণিক দ্বারা ইনজেকশন জিনিস বিশাল সমুদ্র।
জেই কার্টার দ্বিতীয়

একটি বিষয় লক্ষণীয়, এবং কেন এটি হ্রাস করা যেতে পারে, আপনি কেবলমাত্র সেগুলি টেম্পলেটগুলিতে ব্যবহার করতে পারেন, আপনার .ts মডিউলগুলি না কারণ আপনার ফাংশন কলগুলি সংকলনের সময় সমাধান হয় না। এটি "কৌণিক" উপায়ে করার কারণ। তবে, আপনি যদি আপনার টেম্পলেটগুলিতে সজ্জিত এবং এগুলি যুক্ত করতে চান তবে একটি বিশ্বব্যাপী ইউটিলিটি ফাইল সহজ এবং সূক্ষ্ম।
JE কার্টার II
আমাদের সাইট ব্যবহার করে, আপনি স্বীকার করেছেন যে আপনি আমাদের কুকি নীতি এবং গোপনীয়তা নীতিটি পড়েছেন এবং বুঝতে পেরেছেন ।
Licensed under cc by-sa 3.0 with attribution required.