AngularJS - সন্তানের সুযোগে অ্যাক্সেস

Question

আমার যদি নিম্নলিখিত নিয়ন্ত্রক থাকে:

function parent($scope, service) {
    $scope.a = 'foo';

    $scope.save = function() {
        service.save({
            a:  $scope.a,
            b:  $scope.b
        });
    }
}

function child($scope) {
    $scope.b = 'bar';
}

যাক সঠিক পথ কি parentপড়া bআউট child? যদি সংজ্ঞায়িত করতে প্রয়োজন bমধ্যে parent, এটা শব্দার্থিক ভাবে ভুল অভিমানী যে যে করবে না bএকটি সম্পত্তি যে এর সাথে সম্পর্কিত কিছু বর্ণনা করে childএবং parent?

আপডেট করুন: এটা সম্পর্কে আরো চিন্তা করুন, যদি একাধিক সন্তান bএটির জন্য একটি দ্বন্দ্ব তৈরি করবে parentযার উপর bপুনরুদ্ধার করতে। আমার প্রশ্ন থেকে যায়, bএখান থেকে অ্যাক্সেস করার সঠিক উপায় parentকী?

Comments

: এছাড়াও, নিশ্চিত করা আপনি যদি এটি পড়ে stackoverflow.com/questions/14049480/... একটি খুব ভাল এবং ইন-গভীরতা সুযোগ এবং angularJS বংশগতিবিদ্যার ওভারভিউ।

— মার্টিজন

Answer 1

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

Https://groups.google.com/d/msg/angular/LDNz_TQQiNE/ygYrSvdI0A0J ইস্যুতে ভোজতার মন্তব্যগুলি দেখুন

সংক্ষেপে: আপনি পিতামাতার সুযোগ থেকে শিশু স্কোপগুলি অ্যাক্সেস করতে পারবেন না।

আপনার সমাধান:

1. পিতামাতার বৈশিষ্ট্যগুলি সংজ্ঞায়িত করুন এবং তাদের বাচ্চাদের কাছ থেকে অ্যাক্সেস করুন (উপরের লিঙ্কটি পড়ুন)
2. রাষ্ট্র ভাগ করে নেওয়ার জন্য কোনও পরিষেবা ব্যবহার করুন
3. ইভেন্টের মাধ্যমে ডেটা পাস করুন। $emitমূল স্কোপ না হওয়া পর্যন্ত পিতামাতার কাছে ইভেন্টগুলি উপরের $broadcastদিকে প্রেরণ করে এবং ইভেন্টগুলি নীচের দিকে প্রেরণ করে। এটি আপনাকে শব্দার্থতভাবে সঠিক রাখতে সহায়তা করতে পারে।

Comments

প্লাস $ এমিট এবং $ সম্প্রচারের মধ্যে আলাদা যেখানে $ এমিটটি বাতিল-সক্ষম এবং $ সম্প্রচার না d

— আজ্রি জামিল

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

— এএমসি

ধন্যবাদ। অন্য বিকল্প যেমন localStorageনির্ভরতা সঙ্গে হতে পারে ngStorage।

— আকাশ

Answer 2

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

// get $$childHead first and then iterate that scope's $$nextSiblings
for(var cs = scope.$$childHead; cs; cs = cs.$$nextSibling) {
    // cs is child scope
}

বেহালা

Answer 3

আপনি এটি চেষ্টা করতে পারেন:

$scope.child = {} //declare it in parent controller (scope)

তারপরে চাইল্ড কন্ট্রোলারে (স্কোপ) যুক্ত করুন:

var parentScope = $scope.$parent;
parentScope.child = $scope;

এখন সন্তানের সুযোগে পিতামাতার অ্যাক্সেস রয়েছে।

Comments

খুব পরিষ্কার এবং সোজা। এটি যুক্ত করার জন্য কেবল উপলব্ধি করুন যে কোনও বাধ্যবাধকতা নেই তাই যখন আপনি এটিকে প্যারেন্টস্কোপের উপরের মতো ঘোষণা করেন ch শিশুরা সেই মুহুর্তে বাচ্চার সুযোগকে ধারণ করে। এটি সমাধানের জন্য আপনি $ সুযোগ যোগ করতে পারেন $ ঘড়ি (ফাংশন () {পেরেন্টস্কোপ.চাইল্ড = $ সুযোগ;); যাতে প্রতিটি ডাইজেস্টের পরে এটি পিতামাতার উপরে নতুন সুযোগকে ঠেলে দেয়। মূল প্রান্তে আপনি যদি এইচটিএমএল-তে ভিজ্যুয়ালগুলির জন্য চাইল্ড স্কোপগুলির কোনও ব্যবহার করছেন তবে আপনার চাইল্ড ভেরিয়েবলের উপরে একটি ঘড়ি যুক্ত করতে হবে এবং স্কোপটি আপডেট করার জন্য বলবেন: $ সুযোগ $ ঘড়ি ('শিশু', ফাংশন ( ) {$ সুযোগ। $ evAAAnc ();}); । আশা করি এতে কারও কিছুটা সময় সাশ্রয় হয়!

— IfTrue

@IfTrue আমি বিশ্বাস করি একটি $ ঘড়ি () প্রয়োজন হয় না। এগুলি অবজেক্ট এবং এগুলি রেফারেন্স দ্বারা পাস হয়।

— স্বনিধি

@ স্বনিধি = আমি আপনার অর্থ কী তা আমি জানি এবং আমি এটিও ভেবেছিলাম তবে মন্তব্যটি লেখার সময় যখন আমি পরীক্ষা করছিলাম তখন এটি কার্যকর হয়নি। এটি মূল্যবান কিসের জন্য আমি এটিকে সম্পাদন / সম্প্রচারে সরিয়ে নিয়েছি।

— IfTrue

টাইপ স্ক্রিপ্টে এটি কীভাবে করবেন?

— ATHER

আমার জন্য সেরা উত্তর !! জাভাস্ক্রিপ্টে রেফারেন্স হিসাবে বিবেচিত সামগ্রীর সর্বোত্তম উদাহরণ

— বিকাশ গৌতম

Answer 4

একটি সম্ভাব্য কর্মসূচী হ'ল একটি ডি আর ফাংশন ব্যবহার করে পিতা-মাতার নিয়ন্ত্রণকারীর মধ্যে চাইল্ড কন্ট্রোলার ইনজেকশন।

সম্ভাব্য বাস্তবায়ন:

<div ng-controller="ParentController as parentCtrl">
   ...

    <div ng-controller="ChildController as childCtrl" 
         ng-init="ChildCtrl.init()">
       ...
    </div>
</div>

আপনি যেখানে আছেন ChildController:

app.controller('ChildController',
    ['$scope', '$rootScope', function ($scope, $rootScope) {
    this.init = function() {
         $scope.parentCtrl.childCtrl = $scope.childCtrl;
         $scope.childCtrl.test = 'aaaa';
    };

}])

সুতরাং এখন ParentControllerআপনি ব্যবহার করতে পারেন:

app.controller('ParentController',
    ['$scope', '$rootScope', 'service', function ($scope, $rootScope, service) {

    this.save = function() {
        service.save({
            a:  $scope.parentCtrl.ChildCtrl.test
        });
     };

}])

গুরুত্বপূর্ণ:
সঠিকভাবে কাজ করতে আপনাকে এইচটিএমএল যেমন করেছিলাম তেমন ব্যবহার করে আপনাকে নির্দেশিকাটি ব্যবহার করতে হবে ng-controllerএবং প্রতিটি নিয়ামকের নাম পরিবর্তন করতে হবে as।

টিপস: প্রক্রিয়া চলাকালীন
ক্রোম প্লাগইন এনজি-ইন্সপেক্টর ব্যবহার করুন । এটি আপনাকে গাছটি বুঝতে সাহায্য করবে।

Answer 5

$ এমিট এবং $ সম্প্রচারটি ব্যবহার করুন (উপরের মন্তব্যে ওয়ালভ উল্লিখিত)

কোনও ঘটনা উপরের দিকে চালানো (শিশু থেকে পিতামাতার কাছে)

$scope.$emit('myTestEvent', 'Data to send');

কোনও ইভেন্ট নীচের দিকে চালিত করতে (পিতামাতার থেকে শিশু পর্যন্ত)

$scope.$broadcast('myTestEvent', {
  someProp: 'Sending you some data'
});

এবং অবশেষে শুনতে

$scope.$on('myTestEvent', function (event, data) {
  console.log(data);
});

আরও তথ্যের জন্য: - https://toddmotto.com/all-about-angulars-emit-broadcast-on-publish-subscribing/

উপভোগ করুন :)

Answer 6

হ্যাঁ, আমরা চাইল্ড কন্ট্রোলার থেকে প্যারেন্ট কন্ট্রোলারে ভেরিয়েবলগুলি নির্ধারণ করতে পারি। এটি একটি সম্ভাব্য উপায়:

ওভারভিউ: নীচে কোডের মূল লক্ষ্যটি হ'ল চাইল্ড কন্ট্রোলারের $ স্কোপ অর্পণ করা parent পিতামাতার নিয়ন্ত্রকের $ স্কোপ.অ্যাসাইনকে পরিবর্তনশীল

ব্যাখ্যা: দুটি নিয়ামক রয়েছে। এইচটিএমএলে, লক্ষ্য করুন যে পিতা বা মাতা নিয়ামক শিশু নিয়ন্ত্রণকারীকে ঘিরে রাখে enc তার অর্থ শিশু নিয়ন্ত্রকের আগে পিতামাতার নিয়ামককে কার্যকর করা হবে। সুতরাং, প্রথম সেটভ্যালু () সংজ্ঞায়িত করা হবে এবং তারপরে নিয়ন্ত্রণটি শিশু নিয়ন্ত্রকের কাছে যাবে। $ সুযোগ.ভ্যারেবল "শিশু" হিসাবে অর্পণ করা হবে। তারপরে এই সন্তানের সুযোগটি প্যারেন্ট কন্ট্রোলারের ক্রিয়াকলাপের পক্ষে যুক্তি হিসাবে পাস হবে, যেখানে $ সুযোগ.অ্যাসাইন "শিশু" হিসাবে মান পাবে

<!DOCTYPE html>
<html>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>
<script type="text/javascript">
    var app = angular.module('myApp',[]);

    app.controller('child',function($scope){
        $scope.variable = "child";
        $scope.$parent.setValue($scope);
    });

    app.controller('parent',function($scope){
        $scope.setValue = function(childscope) {
            $scope.assign = childscope.variable;
        }
    });

</script>
<body ng-app="myApp">
 <div ng-controller="parent">
    <p>this is parent: {{assign}}</p>
    <div ng-controller="child">
        <p>this is {{variable}}</p>
    </div>
 </div>
</body>
</html>