AngularJS: আমি কীভাবে নিয়ন্ত্রণকারীদের মধ্যে ভেরিয়েবলগুলি পাস করতে পারি?


326

আমার দুটি কৌণিক নিয়ামক রয়েছে:

function Ctrl1($scope) {
    $scope.prop1 = "First";
}

function Ctrl2($scope) {
    $scope.prop2 = "Second";
    $scope.both = Ctrl1.prop1 + $scope.prop2; //This is what I would like to do ideally
}

আমি Ctrl1ভিতরে ব্যবহার করতে পারছি না Ctrl2কারণ এটি সংজ্ঞায়িত। তবে আমি যদি এটির মতো পাস করার চেষ্টা করি ...

function Ctrl2($scope, Ctrl1) {
    $scope.prop2 = "Second";
    $scope.both = Ctrl1.prop1 + $scope.prop2; //This is what I would like to do ideally
}

আমি একটি ত্রুটি পেয়েছি। কেউ কি জানেন, এটা কিভাবে করে?

এরকম

Ctrl2.prototype = new Ctrl1();

ব্যর্থও হয়।

দ্রষ্টব্য: এই নিয়ন্ত্রণকারীরা একে অপরের ভিতরে বাসা বাঁধে না।


অনেক উপায় আছে তবে সবচেয়ে ভাল উপায় হ'ল কৌনিক ঘড়ি। সর্বদা যখন আমরা কোনও কাঠামো ব্যবহার করি তখন কাজের জন্য তার নিজস্ব পদ্ধতিগুলি ব্যবহার করার সর্বোত্তম উপায় এটি ভুলে যাবেন না
pejman

আমি এই ব্লগটিকে খুব সহায়ক ব্লগ
ব্ল্যাক এমবাবা

উত্তর:


503

একাধিক কন্ট্রোলারগুলিতে ভেরিয়েবলগুলি ভাগ করার একটি উপায় হ'ল কোনও পরিষেবা তৈরি করা এবং আপনি যে কোনও নিয়ামক যেখানে এটি ব্যবহার করতে চান তাতে এটি ইনজেকশন করা।

সাধারণ পরিষেবার উদাহরণ:

angular.module('myApp', [])
    .service('sharedProperties', function () {
        var property = 'First';

        return {
            getProperty: function () {
                return property;
            },
            setProperty: function(value) {
                property = value;
            }
        };
    });

একটি নিয়ামক পরিষেবাটি ব্যবহার করে:

function Ctrl2($scope, sharedProperties) {
    $scope.prop2 = "Second";
    $scope.both = sharedProperties.getProperty() + $scope.prop2;
}

এটি এই ব্লগে খুব সুন্দরভাবে বর্ণনা করা হয়েছে (পাঠ 2 এবং বিশেষত)

আমি খুঁজে পেয়েছি যে আপনি যদি একাধিক কন্ট্রোলার জুড়ে এই বৈশিষ্ট্যগুলিকে আবদ্ধ করতে চান তবে সীমাবদ্ধ রেফারেন্স ধরে রাখতে আপনি কোনও আদিম ধরণের (বুলিয়ান, স্ট্রিং, সংখ্যা) পরিবর্তে কোনও বস্তুর সম্পত্তিতে আবদ্ধ হলে এটি আরও ভাল কাজ করে।

উদাহরণ: var property = { Property1: 'First' };পরিবর্তে var property = 'First';


আপডেট: এখানে (আশাবাদী) বিষয়গুলিকে আরও স্পষ্ট করে তোলার জন্য একটি ফ্রিডল যা এর উদাহরণ দেখায়:

  • ভাগ করা মানের স্থির অনুলিপিগুলিতে আবদ্ধ (আমারকন্ট্রোলার 1 এ)
    • একটি আদিম (স্ট্রিং) এর সাথে আবদ্ধ
    • কোনও বস্তুর সম্পত্তির সাথে আবদ্ধ (স্কোপ ভেরিয়েবলে সংরক্ষণ করা)
  • ভাগ করা মানগুলিতে আবদ্ধ হওয়া যা মানগুলি আপডেট হওয়ার সাথে সাথে ইউআই আপডেট করে (মাইকন্ট্রোলার 2 এ)
    • কোনও ফাংশনের সাথে আবদ্ধ হওয়া যা আদিম (স্ট্রিং) দেয়
    • বস্তুর সম্পত্তির সাথে আবদ্ধ
    • কোনও জিনিসের সম্পত্তিতে দ্বিপাক্ষিক বাধ্যতামূলক

5
সেক্ষেত্রে - শেয়ার্ডপ্রপ্রেটিস.জেটপ্রোপার্টি () মান পরিবর্তিত হলে Ctrl2 এর সুযোগ কীভাবে "জানবে"?
OpherV

5
আপনি যদি প্রতিবার সম্পত্তিটি পরিবর্তনের জন্য আপনার ইউআই আপডেট করতে চান তবে আপনি bothএকটি ফাংশন হিসাবে পরিবর্তিত হতে পারেন এবং এটি কৌণিক ডাইজেস্ট প্রক্রিয়া চলাকালীন পুনরায় মূল্যায়ন / বলা হবে। একটি উদাহরণের জন্য এই ঝাঁকুনি দেখুন । এছাড়াও যদি আপনি কোনও সামগ্রীর সম্পত্তিতে আবদ্ধ হন তবে আপনি সরাসরি নিজের দৃষ্টিতে এটি ব্যবহার করতে পারেন এবং ডেটা এই উদাহরণের সাথে পরিবর্তিত হওয়ায় এটি আপডেট হবে ।
গ্লোপি

11
আপনি সনাক্ত করতে চান এবং আপনার নিয়ামক পরিবর্তনের প্রতিক্রিয়া যদি একটি বিকল্প যোগ হয় getProperty()সুযোগ ফাংশন এবং ব্যবহার $ সুযোগ। $ ঘড়ি মত এই উদাহরণে । আশা করি এই উদাহরণগুলি সাহায্য করবে!
গ্লোপি

1
এখানে সমস্যা আছে কারণ পরিষেবাগুলি রাষ্ট্রহীন হওয়া উচিত। কোনও পরিষেবার অভ্যন্তরে কোনও সম্পত্তি সঞ্চয় করা ভুল (তবে সুবিধাজনক)। আমি ডেটা পড়তে এবং লেখার জন্য $ cacheFactory ব্যবহার শুরু করি। আমি প্রায় একই রকম পরিষেবাটি গ্লোপি হিসাবে ব্যবহার করি তবে পরিষেবাটিতে স্টেট স্টোর করার পরিবর্তে, এটি এখন ক্যাশে। প্রথমে একটি ক্যাশে পরিষেবা তৈরি করুন: কৌণিক.মুডুল ('ক্যাশে সার্ভিস', ['এনজি'])। কারখানা ('ক্যাশে সার্ভিস', ফাংশন ($ ক্যাশেফ্যাক্টরি) {রিটার্ন $ ক্যাশেফ্যাক্টরি ('ক্যাশে সার্ভিস');}); আপনার অ্যাপ্লিকেশন.জেজে অন্তর্ভুক্ত করুন, পরিষেবাতে এটি ইনজেকশন করুন, এটি এর মতো ব্যবহার করুন: CacheService.get (কী) রিটার্ন করুন; বা ক্যাশে সার্ভিস.পুট (কী, মান);
জর্দান পাপালেও

4
কৌণিক দস্তাবেজে বর্ণিত .serviceপরিবর্তে এই উত্তরটি কীভাবে এবং কেন ব্যবহার করে তা ছিন্ন করার চেষ্টা করা হচ্ছে .factory। ডকুমেন্টেশন একটি ভিন্ন পদ্ধতি ব্যবহার করে কেন এই উত্তর এত বেশি ভোট দেওয়া হয়?
pspahn

44

আমি সাধারণ বিষয়গুলি সাধারণ উদাহরণ দিয়ে বর্ণনা করতে চাই :)

এখানে একটি খুব সাধারণ Serviceউদাহরণ:


angular.module('toDo',[])

.service('dataService', function() {

  // private variable
  var _dataObj = {};

  // public API
  this.dataObj = _dataObj;
})

.controller('One', function($scope, dataService) {
  $scope.data = dataService.dataObj;
})

.controller('Two', function($scope, dataService) {
  $scope.data = dataService.dataObj;
});

এবং এখানে jsbin

এবং এখানে একটি খুব সাধারণ Factoryউদাহরণ:


angular.module('toDo',[])

.factory('dataService', function() {

  // private variable
  var _dataObj = {};

  // public API
  return {
    dataObj: _dataObj
  };
})

.controller('One', function($scope, dataService) {
  $scope.data = dataService.dataObj;
})

.controller('Two', function($scope, dataService) {
  $scope.data = dataService.dataObj;
});

এবং এখানে jsbin


যদি এটি খুব সহজ হয় তবে এখানে আরও পরিশীলিত উদাহরণ রয়েছে

এছাড়াও এর সাথে সম্পর্কিত সর্বোত্তম কার্যাভ্যাস মন্তব্যের জন্য এখানে উত্তর দেখুন


1
হ্যা আমি আপনার সাথে একমত. সবসময় জিনিস সহজ করার চেষ্টা করুন।
ইভান হু

আপনি var _dataObj = {};যখন এটির প্রত্যক্ষ রেফারেন্স ফিরিয়ে দিচ্ছেন তখন ঘোষণার কী অর্থ হয় ..? এটি ব্যক্তিগত নয় । প্রথম উদাহরণে আপনি এটি করতে পারেন this.dataObj = {};এবং দ্বিতীয়টিতে return { dataObj: {} };এটি একটি অকেজো পরিবর্তনশীল ঘোষণা IMHO।
টিজে

@ টিজে পয়েন্টটি হ'ল এই উপাদানটি অন্যান্য উপাদানগুলির মধ্যে ভাগ করে নেওয়া। ভাগ করে নেওয়ার ধারণাটি চিত্রিত করার এটি একটি প্রাথমিক উদাহরণ। ভেরিয়েবলটি ব্লকের অভ্যন্তরে প্রাইভেট থাকে, তবে আপনি এটি প্রকাশক প্যাটার্নটি ব্যবহার করে সর্বজনীন পরিবর্তনশীল হিসাবে প্রকাশ করবেন। এইভাবে ভেরিয়েবলটি ধরে রাখা এবং এটি ব্যবহারের মধ্যে দায়িত্বগুলির বিচ্ছেদ রয়েছে।
দিমিত্রি জায়তসেভ

@ দিমিত্রিজেটসেভ আপনি "সরল উদাহরণ" বলছেন তবে আপনি যদি বেসরকারী রাষ্ট্রের ব্যবহার কীভাবে সঠিকভাবে না করেন তবে আপনি মানুষকে বিভ্রান্ত করছেন। যতক্ষণ আপনি প্রত্যক্ষ রেফারেন্স ফিরিয়ে দেন ততক্ষণ আপনার উদাহরণে কোনও ব্যক্তিগত অবস্থা নেই।
টিজে

@ টিজে আমি বিভ্রান্তিকর কিছু দেখতে পাচ্ছি না। একটি ব্যক্তিগত পরিবর্তনশীল একটি মডিউল দ্বারা উদ্ভাসিত করা যেতে পারে। আরও ভাল উত্তর লিখতে নির্দ্বিধায়।
দিমিত্রি জইতসেভ

26

--- আমি জানি যে এই উত্তরটি এই প্রশ্নের জন্য নয়, তবে আমি চাই এমন লোকেরা যারা এই প্রশ্নটি পড়ে এবং কারখানার মতো পরিষেবাগুলি পরিচালনা করতে চায় তারা এগুলি করতে না পারে ----

এর জন্য আপনাকে কোনও পরিষেবা বা কারখানা ব্যবহার করতে হবে।

নেস্টেড নিয়ন্ত্রকদের মধ্যে ডেটা ভাগ করার জন্য পরিষেবাগুলি হ'ল সেরা অনুশীলন

তথ্য ভাগ করে নেওয়ার বিষয়ে এই বিষয়টিতে একটি খুব ভাল টীকাটি হল কীভাবে অবজেক্টগুলি ডিক্লেয়ার করতে হয়। আমি দুর্ভাগ্য ছিল কারণ এটি পড়ার আগে আমি একটি কৌণিক জেএস ফাঁদে পড়েছিলাম এবং আমি খুব হতাশ হয়েছিলাম। সুতরাং আমাকে এই সমস্যা এড়াতে আপনাকে সহায়তা করুন।

আমি "এনজি-বই: অ্যাঙ্গুলারজেএস-এ সম্পূর্ণ বই" থেকে পড়েছি যে কৌণিক জেএসজি এনজি-মডেলগুলি নিয়ন্ত্রণের মধ্যে খালি-ডেটা হিসাবে তৈরি করা হয় তা ভুল!

একটি $ সুযোগ উপাদান তৈরি করা উচিত:

angular.module('myApp', [])
.controller('SomeCtrl', function($scope) {
  // best practice, always use a model
  $scope.someModel = {
    someValue: 'hello computer'
  });

এবং এটির মতো নয়:

angular.module('myApp', [])
.controller('SomeCtrl', function($scope) {
  // anti-pattern, bare value
  $scope.someBareValue = 'hello computer';
  };
});

কারণ এটি ডম (এইচটিএমএল ডকুমেন্ট) এর জন্য কলগুলি অন্তর্ভুক্ত করার জন্য (সর্বোত্তম অনুশীলন) পুনরায় সংযুক্ত করা হয়েছে is

<div ng-model="someModel.someValue"></div>  //NOTICE THE DOT.

নেস্টেড কন্ট্রোলারদের জন্য এটি খুব সহায়ক যদি আপনি চান যে আপনার সন্তানের নিয়ামক পিতামাতা নিয়ন্ত্রকের কাছ থেকে কোনও বস্তু পরিবর্তন করতে সক্ষম হন ....

তবে আপনার ক্ষেত্রে আপনি নেস্টেড স্কোপগুলি চান না, তবে পরিষেবাগুলি থেকে নিয়ন্ত্রকদের কাছে অবজেক্টগুলি পাওয়ার অনুরূপ দিক রয়েছে।

আসুন আপনাকে বলুন যে আপনার পরিষেবা 'কারখানা' রয়েছে এবং প্রত্যাবর্তনের জায়গাতে একটি অবজেক্টএ রয়েছে যার মধ্যে অবজেক্টবি রয়েছে যার মধ্যে অবজেক্টসি রয়েছে।

যদি আপনার কন্ট্রোলার থেকে আপনি অবজেক্ট সিটিকে আপনার আওতায় আনতে চান তবে এটি বলতে ভুল:

$scope.neededObjectInController = Factory.objectA.objectB.objectC;

যে কাজ করবে না ... পরিবর্তে শুধুমাত্র একটি বিন্দু ব্যবহার করুন।

$scope.neededObjectInController = Factory.ObjectA;

তারপরে, ডোমে আপনি অবজেক্টএ থেকে অবজেক্টসি কল করতে পারবেন। এটি কারখানার সাথে সম্পর্কিত একটি সেরা অনুশীলন, এবং সর্বাধিক গুরুত্বপূর্ণ এটি অপ্রত্যাশিত এবং অপ্রত্যাশিত ত্রুটিগুলি এড়াতে সহায়তা করবে।


2
আমি মনে করি এটি একটি ভাল উত্তর, তবে এটি হজম করা বেশ কঠিন।
pspahn

17

Creating রুটস্কোপ ব্যবহার করে পরিষেবা তৈরি না করে সমাধান:

অ্যাপ্লিকেশন নিয়ন্ত্রণকারীদের জুড়ে বৈশিষ্ট্যগুলি ভাগ করতে আপনি কৌনিক $ রুটস্কোপ ব্যবহার করতে পারেন। এটি ডেটা ভাগ করে নেওয়ার জন্য এটি অন্য বিকল্প, যাতে এটি দেওয়া হয় যাতে লোকেরা এটি সম্পর্কে জানতে পারে।

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

var app = angular.module('mymodule',[]);
app.controller('Ctrl1', ['$scope','$rootScope',
  function($scope, $rootScope) {
    $rootScope.showBanner = true;
}]);

app.controller('Ctrl2', ['$scope','$rootScope',
  function($scope, $rootScope) {
    $rootScope.showBanner = false;
}]);

কোনও টেমপ্লেটে $ রুটস্কোপ ব্যবহার করা হচ্ছে ($ মূল সহ বৈশিষ্ট্য অ্যাক্সেস করুন):

<div ng-controller="Ctrl1">
    <div class="banner" ng-show="$root.showBanner"> </div>
</div>

5
আপনি সেই সময়ে বিশ্বব্যাপী স্কোপযুক্ত ভেরিয়েবলগুলি ব্যবহার করছেন যা স্থানীয়ভাবে তার বিভিন্ন কাঠামোর মধ্যে সমস্ত কিছু স্কোপ করার অ্যাংুলারজেএস ধারণা থেকে বিচ্যুত হয়। গ্লোবাল ভেরিয়েবল ফাইল যুক্ত করা একই জিনিস অর্জন করবে এবং ভেরিয়েবলটি মূলত সংজ্ঞায়িত হয়েছে তা সন্ধান করা আরও সহজ করে তুলবে। যেভাবেই হোক, প্রস্তাবিত নয়।
জৈব ক্যাট

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

8

উপরের নমুনা একটি কবজ মত কাজ করে। আমার একাধিক মানগুলি পরিচালনা করার প্রয়োজনে আমি কেবল একটি সংশোধন করেছি। আশা করি এটা কাজে লাগবে!

app.service('sharedProperties', function () {

    var hashtable = {};

    return {
        setValue: function (key, value) {
            hashtable[key] = value;
        },
        getValue: function (key) {
            return hashtable[key];
        }
    }
});

1
আমি বিভিন্ন নিয়ামক জুড়ে ডেটা ভাগ করতে একটি পরিষেবা ব্যবহার করে একটি নমুনাও তৈরি করেছি। আমি আশা করি তোমারা এটা পছন্দ করবে. jsfiddle.net/juazammo/du53553a/1
জুয়ান জামোরা

1
যদিও এটি কাজ করে, এটি সাধারণত সিনট্যাক্স .factory। একটি .serviceব্যবহার করা উচিত অনুযায়ী "আপনি একটি প্রকার / শ্রেণী হিসেবে আপনার সেবা সংজ্ঞায়িত" docs.angularjs.org/api/auto/service/$provide#service
দিমিত্রি Zaitsev

1
দিমিত্রি, আপনি ঠিক বলেছেন তবে আমার দৃষ্টিকোণ থেকে কৌণিক ছেলেরা সার্ভিস (কারখানার) এবং কারখানার মধ্যে আমার ধারণার কিছুটা পরিবর্তন করেছে .... ওহ ভাল ....
জুয়ান জামোরা

1
এবং আমাকে ভুল হলে আমাকে সংশোধন করুন, পরিষেবাগুলির উদ্দেশ্য এমন কোনও কিছু ফেরত দেওয়ার উদ্দেশ্যে যা কোনও বস্তু বা মান হতে পারে। কারখানাগুলি অবজেক্ট তৈরির উদ্দেশ্যে তৈরি। একটি মুখবন্ধ যা আসলে কার্যকারিতার সংকলন যা কিছু ফিরিয়ে দেয়, সেটাই আমি ভেবেছিলাম যেখানে পরিষেবাগুলি। কারখানাগুলি থেকে আমন্ত্রণমূলক ক্রিয়াকলাপ সহ। আবার, এটি আমার পক্ষে কী এবং মূলত কৌণিক দৃষ্টিকোণ থেকে এটি নয় তার মূল ধারণাটি পেয়ে যাচ্ছি। (অ্যাবস্ট্রাক্ট ফ্যাক্টরি ডোফটরি / নেট / অ্যাবস্ট্রাক্ট-ফ্যাক্টরি- ডিজাইন- প্যাটার্ন ) এবং একটি অ্যাডাপ্টারের পদ্ধতির বিষয়টি হ'ল আমি পরিষেবা হিসাবে প্রকাশ করব
জুয়ান জামোরা

1
এখানে অ্যাডাপ্টার প্যাটার্নটি দেখুন doftory.com/net/adapter- ডিজাইন-
জুয়ান জামোরা

6

আমি মান ব্যবহার করার প্রবণতা করি, কেন এটি খারাপ ধারণা তা নিয়ে আলোচনার জন্য কারও জন্য খুশি ..

var myApp = angular.module('myApp', []);

myApp.value('sharedProperties', {}); //set to empty object - 

তারপরে একটি পরিষেবা অনুযায়ী মানটি ইনজেক্ট করুন।

সিটিআরএল 1 এ সেট করুন:

myApp.controller('ctrl1', function DemoController(sharedProperties) {
  sharedProperties.carModel = "Galaxy";
  sharedProperties.carMake = "Ford";
});

এবং ctrl2 থেকে অ্যাক্সেস:

myApp.controller('ctrl2', function DemoController(sharedProperties) {
  this.car = sharedProperties.carModel + sharedProperties.carMake; 

});

কোনও পরিষেবা ব্যবহার করা থেকে এটি কীভাবে আলাদা?
দোপাট্রামন

5

নিম্নলিখিত উদাহরণটি দেখায় যে কীভাবে ভাইবোন নিয়ন্ত্রণকারীদের মধ্যে ভেরিয়েবলগুলি পাস করতে হবে এবং মান পরিবর্তিত হলে একটি পদক্ষেপ নিতে হবে।

কেস উদাহরণ ব্যবহার করুন: আপনার একটি সাইডবারে একটি ফিল্টার রয়েছে যা অন্য দৃশ্যের সামগ্রী পরিবর্তন করে।

angular.module('myApp', [])

  .factory('MyService', function() {

    // private
    var value = 0;

    // public
    return {
      
      getValue: function() {
        return value;
      },
      
      setValue: function(val) {
        value = val;
      }
      
    };
  })
  
  .controller('Ctrl1', function($scope, $rootScope, MyService) {

    $scope.update = function() {
      MyService.setValue($scope.value);
      $rootScope.$broadcast('increment-value-event');
    };
  })
  
  .controller('Ctrl2', function($scope, MyService) {

    $scope.value = MyService.getValue();

    $scope.$on('increment-value-event', function() {    
      $scope.value = MyService.getValue();
    });
  });
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<div ng-app="myApp">
  
  <h3>Controller 1 Scope</h3>
  <div ng-controller="Ctrl1">
    <input type="text" ng-model="value"/>
    <button ng-click="update()">Update</button>
  </div>
  
  <hr>
  
  <h3>Controller 2 Scope</h3>
  <div ng-controller="Ctrl2">
    Value: {{ value }}
  </div>  

</div>


4

আমি এই প্রশ্নে অবদান রাখতে চাই যে নিয়ন্ত্রক এবং এমনকি নির্দেশাবলীর মধ্যে ডেটা ভাগ করার প্রস্তাবিত উপায়টি পরিষেবা (কারখানা) ব্যবহার করে এটি ইতিমধ্যে চিহ্নিত করা হয়েছে, তবে আমি এটি সরবরাহ করতে চাই কীভাবে এটি করা উচিত তার বাস্তব উদাহরণে কাজ করা।

এখানে কার্যনির্বাহী নিমন্ত্রক: http://plnkr.co/edit/Q1VdKJP2tpvqqJL1LF6m?p=info

প্রথমে আপনার পরিষেবাটি তৈরি করুন , এতে আপনার ভাগ করা ডেটা থাকবে :

app.factory('SharedService', function() {
  return {
    sharedObject: {
      value: '',
      value2: ''
    }
  };
});

তারপরে, এটি কেবল আপনার কন্ট্রোলারগুলিতে ইনজেক্ট করুন এবং আপনার সুযোগে ভাগ করা ডেটাটি ধরুন:

app.controller('FirstCtrl', function($scope, SharedService) {
  $scope.model = SharedService.sharedObject;
});

app.controller('SecondCtrl', function($scope, SharedService) {
  $scope.model = SharedService.sharedObject;
});

app.controller('MainCtrl', function($scope, SharedService) {
  $scope.model = SharedService.sharedObject;
});

আপনার নির্দেশের জন্য আপনি এটিও করতে পারেন , এটি একইভাবে কাজ করে:

app.directive('myDirective',['SharedService', function(SharedService){
  return{
    restrict: 'E',
    link: function(scope){
      scope.model = SharedService.sharedObject;
    },
    template: '<div><input type="text" ng-model="model.value"/></div>'
  }
}]);

আশা করি এই বাস্তব এবং পরিষ্কার উত্তর কারও পক্ষে সহায়ক হতে পারে।


3

আপনি পরিষেবা বা কারখানার সাহায্যে এটি করতে পারেন। কিছু মূল পার্থক্যের জন্য এগুলি মূলত একই। আমি এই ব্যাখ্যাটি চিন্তাকর্তা.কে অনুসরণ করা সবচেয়ে সহজ হওয়াতে খুঁজে পেয়েছি । সহজ, কার্যকর এবং কার্যকর।


1
"আপনি পরিষেবা বা কারখানাগুলি দিয়ে এটি করতে পারতেন" - কিভাবে ..? কীভাবে এটি ওপি জিজ্ঞাসা করছে ... দয়া করে বাহ্যিক সংস্থাগুলির সাথে লিঙ্ক না করে স্ট্যাকওভারফ্লোতে সম্পূর্ণ উত্তর পোস্ট করুন, লিঙ্কগুলি ওভারটাইম কমতে পারে।
টিজে

2

আপনি কি স্কোপস পিতামাতার সম্পত্তি অংশ করতে পারবেন না?

$scope.$parent.property = somevalue;

আমি বলছি না এটি ঠিক আছে তবে এটি কাজ করে।


3
লেখক বলেছেন যে NOTE: These controllers are not nested inside each other.। এগুলি যদি নেস্টেড কন্ট্রোলার বা কন্ট্রোলাররা একই পিতামাতাকে ভাগ করে নিয়েছিল তবে এটি কাজ করবে, তবে আমরা এটি আশা করতে পারি না।
ক্রিস ফস্টার 21

2
$parentযদি এড়ানো যায় তবে সাধারণত নির্ভর করা একটি খারাপ অভ্যাস practice একটি সু-নকশাযুক্ত পুনরায় ব্যবহারযোগ্য উপাদানটি তার পিতামাতার সম্পর্কে জানা উচিত নয়।
দিমিত্রি জায়তসেভ

2

আহ, অন্য বিকল্প হিসাবে এই নতুন জিনিস কিছু আছে। এটি স্থানীয় স্টোরেজ, এবং কৌনিক যেখানে কাজ করে সেখানে কাজ করে। আপনাকে স্বাগতম. (তবে সত্যই, লোকটিকে ধন্যবাদ জানাই)

https://github.com/gsklee/ngStorage

আপনার ডিফল্ট সংজ্ঞা দিন:

$scope.$storage = $localStorage.$default({
    prop1: 'First',
    prop2: 'Second'
});

মানগুলি অ্যাক্সেস করুন:

$scope.prop1 = $localStorage.prop1;
$scope.prop2 = $localStorage.prop2;

মান সংরক্ষণ করুন

$localStorage.prop1 = $scope.prop1;
$localStorage.prop2 = $scope.prop2;

আপনার অ্যাপ্লিকেশনে এনজিস্টোরেজ এবং আপনার নিয়ামকটিতে S লোকালস্টোরেশন ইনজেকশন মনে রাখবেন।


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

1

এই কাজটি করার দুটি পদ্ধতি আছে

1) get / set পরিষেবাটি ব্যবহার করুন

2) $scope.$emit('key', {data: value}); //to set the value

 $rootScope.$on('key', function (event, data) {}); // to get the value

1

দ্বিতীয় পদ্ধতি:

angular.module('myApp', [])
  .controller('Ctrl1', ['$scope',
    function($scope) {

    $scope.prop1 = "First";

    $scope.clickFunction = function() {
      $scope.$broadcast('update_Ctrl2_controller', $scope.prop1);
    };
   }
])
.controller('Ctrl2', ['$scope',
    function($scope) {
      $scope.prop2 = "Second";

        $scope.$on("update_Ctrl2_controller", function(event, prop) {
        $scope.prop = prop;

        $scope.both = prop + $scope.prop2; 
    });
  }
])

এইচটিএমএল:

<div ng-controller="Ctrl2">
  <p>{{both}}</p>
</div>

<button ng-click="clickFunction()">Click</button>

আরও তথ্যের জন্য নিমজ্জন দেখুন:

http://plnkr.co/edit/cKVsPcfs1A1Wwlud2jtO?p=preview


1
Ctrl2(শ্রোতা) কেবলমাত্র শিশু নিয়ন্ত্রণকারী হলেই কাজ করে Ctrl1। ভাইবোন নিয়ন্ত্রণকারীদের মাধ্যমে যোগাযোগ করতে হবে $rootScope
হার্জবিউব

0

আপনি যদি পরিষেবাটি তৈরি করতে না চান তবে আপনি এটি এর মতো করতে পারেন।

var scope = angular.element("#another ctrl scope element id.").scope();
scope.plean_assign = some_value;

37
আমি এই উত্তরটি কাজ করে কিনা সন্দেহ করি না তবে আমি এটি নোট করতে চাই যে এটি AngularJS এর ​​দর্শনের বিপরীতে চলে আপনার মডেল / নিয়ামক কোডে কখনই ডোম অবজেক্ট না থাকে।
জোকুল

3
-১ কারণ আমার মতে, ডিওএমের মাধ্যমে নিয়ন্ত্রক যোগাযোগটি খারাপ অভ্যাস।
ক্রিস ফস্টার 21

3
@ ক্রিসফোস্টার, কেবল একটি হাতুড়ি "সরঞ্জাম" হিসাবে বিক্রি হওয়ার কারণে, এর অর্থ এই নয় যে এটি কাগজের ওজন হিসাবে ব্যবহার করা যাবে না। আমি নিশ্চিত যে ওখানকার প্রতিটি কাঠামো বা সরঞ্জামের জন্য আপনি সর্বদা বিকাশকারীদের খুঁজে পাবেন যা "সেরা অনুশীলন" তালিকার "নমন" করতে হবে।
আন্দ্রে ভি ভি

5
@ আন্ড্রেইভি - খুব কম উপমা, কাগজের ওজন হিসাবে হাতুড়ি ব্যবহার করার কোনও অসুবিধা নেই। এর মতো খারাপ অভ্যাস করার স্পষ্ট অসুবিধাগুলি রয়েছে এবং সহজেই স্প্যাগেটি কোডে বাড়ে। উপরের কোডটি ভঙ্গুর কারণ এটি এখন আপনার নিয়ামকটি ডিওমে কোথায় রয়েছে এবং এটি পরীক্ষা করা খুব কঠিন on কোনও পরিষেবা ব্যবহার করা কোনও কারণের জন্য আরও ভাল অনুশীলন, কারণ এটি আপনার প্রয়োগটিকে আপনার টেমপ্লেটের সাথে সংযুক্ত করে না। আমি সম্মত হই যে বিকাশকারীদের প্রায়শই সেরা অনুশীলনগুলির তালিকাটি বাঁকানো দরকার, তবে যখন একটি পরিষ্কার, সাধারণ, আরও বেশি মডুলার সেরা অনুশীলন হয় যা আরও ভাল কাজ করে not
ক্রিস ফস্টার 17

-1

S রুটস্কোপ এবং পরিষেবাগুলি ছাড়াও, ভাগ করা ডেটা যুক্ত করতে কৌণিক প্রসারিত করার জন্য একটি পরিষ্কার এবং সহজ বিকল্প সমাধান রয়েছে:

নিয়ন্ত্রকদের মধ্যে:

angular.sharedProperties = angular.sharedProperties 
    || angular.extend(the-properties-objects);

এই বৈশিষ্ট্যগুলি 'কৌণিক' অবজেক্টের সাথে সম্পর্কিত, স্কোপগুলি থেকে পৃথক করে এবং স্কোপ এবং পরিষেবাদিতে ভাগ করা যায়।

এটির 1 টি সুবিধা যা আপনাকে অবজেক্টটি ইনজেক্ট করতে হবে না: সেগুলি আপনার সংজ্ঞার পরপরই যে কোনও জায়গায় অ্যাক্সেসযোগ্য!


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