এনজি-অন্তর্ভুক্ত ব্যবহার করার সময় সুযোগ হারানো

Question

আমার এই মডিউল রুট রয়েছে:

var mainModule = angular.module('lpConnect', []).
    config(['$routeProvider', function ($routeProvider) {
    $routeProvider.
        when('/home', {template:'views/home.html', controller:HomeCtrl}).
        when('/admin', {template:'views/admin.html', controller:AdminCtrl}).
        otherwise({redirectTo:'/connect'});
}]);

হোম এইচটিএমএল:

<div ng-include src="views.partial1"></div>

partial1 এইচটিএমএল:

<form ng-submit="addLine()">
    <input type="text" ng-model="lineText" size="30" placeholder="Type your message here">
</form>

HomeCtrl:

function HomeCtrl($scope, $location, $window, $http, Common) {
    ...
    $scope.views = {
        partial1:"views/partial1.html"
    };

    $scope.addLine = function () {
        $scope.chat.addLine($scope.lineText);
        $scope.lines.push({text:$scope.lineText});
        $scope.lineText = "";
    };
...
}

ইন addLineফাংশন $scope.lineTextহয় undefined, এই যোগ করে সমাধান করা যেতে পারে ng-controller="HomeCtrl"থেকে partial1.htmlঅবশ্য এটা নিয়ামক দুইবার বলা হবে কারণ। আমি এখানে কি মিস করছি?

Answer 1

এর কারণেই এটি ng-includeএকটি নতুন বাচ্চার সুযোগ তৈরি করে, তাই $scope.lineTextপরিবর্তিত হয় না। আমি মনে করি thisএটি বর্তমান সুযোগকে বোঝায় তাই this.lineTextসেট করা উচিত।

Answer 2

@ রেনান যেমন উল্লেখ করেছেন, এনজি-অন্তর্ভুক্ত একটি নতুন বাচ্চার সুযোগ তৈরি করে। এই স্কোপটি মূলত হোমসিআরটিএল সুযোগ থেকে উত্তরাধিকারসূত্রে (নীচে ড্যাশযুক্ত লাইনগুলি দেখুন) its ng-model="lineText"আসলে বাচ্চাদের স্কোপে আদিম স্কোপ সম্পত্তি তৈরি করে, হোমসিআরটিএল এর সুযোগ নয়। এই সন্তানের সুযোগটি পিতামাতার / হোমসিআরটিএল স্কোপে অ্যাক্সেসযোগ্য নয়:

ব্যবহারকারী হোমসিআরটিএল এর $ স্কোপ.লাইনস অ্যারে টাইপ করেছেন তা সংরক্ষণ করার জন্য, আমি আপনাকে অ্যাডলাইন ফাংশনটিতে মানটি পাস করার পরামর্শ দিচ্ছি:

 <form ng-submit="addLine(lineText)">

এছাড়াও, যেহেতু লাইনটেক্সট এনজিআইকিউনড স্কোপ / আংশিক মালিকানাধীন তাই আমি মনে করি এটি পরিষ্কার করার জন্য এটি দায়বদ্ধ হওয়া উচিত:

 <form ng-submit="addLine(lineText); lineText=''">

ফাংশন অ্যাডলাইন () এভাবে পরিণত হবে:

$scope.addLine = function(lineText) {
    $scope.chat.addLine(lineText);
    $scope.lines.push({
        text: lineText
    });
};

বেহালার ।

বিকল্প:

• HomeCtrl এর $ সুযোগ উপর একটি বস্তু সম্পত্তি সংজ্ঞায়িত, এবং ব্যবহার করে আংশিক মধ্যে: ng-model="someObj.lineText; বেহালা
• একটি এক্সেস তৈরি করতে / আংশিক ব্যবহারের $ পিতা বা মাতা: প্রস্তাবিত নয়, এই একটি হ্যাক এর বেশি হয় lineTextHomeCtrl $ সুযোগ উপর সম্পত্তি:   ng-model="$parent.lineText"; বেহালা

উপরোক্ত দুটি বিকল্প কেন কাজ করে তা ব্যাখ্যা করার জন্য এটি কিছুটা জড়িত তবে এটি এখানে পুরোপুরি ব্যাখ্যা করা হয়েছে: অ্যাঙ্গুলারজেএসে স্কোপ প্রোটোটাইপাল / প্রোটোটাইপিকাল উত্তরাধিকারের সংক্ষিপ্তকরণগুলি কী কী?

আমি thisঅ্যাডলাইন () ফাংশনে ব্যবহার করার পরামর্শ দিচ্ছি না । কোন সুযোগটি অ্যাক্সেস / ম্যানিপুলেট করা হচ্ছে তা এটি খুব কম স্পষ্ট হয়ে যায়।

Comments

অবশেষে বুঝলাম।

— স্কট টেসলার

@ জেসের একই প্রশ্ন, কেন এটি হ্যাক হিসাবে বিবেচিত?

— qbert65536

@ qbert65536, এটি মূলত একটি হ্যাক / ভঙ্গুর কারণ আপনি যদি এইচটিএমএল পুনর্গঠন করেন তবে এটি আর কাজ করবে না। উদাহরণস্বরূপ, $parent.$parent...এটির কাজ করার জন্য আপনাকে তখন ব্যবহারের প্রয়োজন হতে পারে । আরেকটি উপায় রাখুন, $parentডিওএম কাঠামো সম্পর্কে অনুমানগুলি তৈরি করে ।

— মার্ক Rajcok

উপরের @ জেসের লিঙ্কটি এই বোঝার স্কোপগুলিকে এনজিইনক্লোডে পরিবর্তন করা হয়েছে । পুরো পৃষ্ঠাটি পড়ুন, দুর্দান্ত।

— ম্যারানক্রুজ

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

— zhara

Answer 3

এর পরিবর্তে ব্যবহার করার thisযেমন গৃহীত উত্তর দাড়ায়, ব্যবহার $parentপরিবর্তে। সুতরাং আপনার মধ্যে partial1.htmlপাবেন:

<form ng-submit="$parent.addLine()">
    <input type="text" ng-model="$parent.lineText" size="30" placeholder="Type your message here">
</form>

যদি আপনি ng-includeবা অন্যান্য নির্দেশের সুযোগ সম্পর্কে আরও জানতে চান তবে এটি পরীক্ষা করে দেখুন: https://github.com/angular/angular.js/wiki/Unders સમજ- স্কোপস# ng- অন্তর্ভুক্ত করুন

Comments

কোনো পাঠক তিনি মানে $scope.$parentপরিবর্তে $parentকৌণিক অনুযায়ী undefined করা হয়।

— Sebastialonso

এই উত্তরটি আমার জন্য দিনটি বাঁচায়! $ পিতামাতার ব্যবহার নির্দেশ করার জন্য অনেক ধন্যবাদ।

— ডেরেক ওয়েব

$ সুযোগ। $ পিতামাতা রেফারেন্স দিয়ে পাস? বা এটা কি পিতামাতার একটি অনুলিপি?

— ওএমজিপিওপি

পুনঃটুইট করেছেন $ সুযোগ। $ প্যারেন্ট.লাইনটেক্সটটি অনির্ধারিত। $ parent.lineText কাজ করছে, this.lineText বা শুধু মাত্র lineText এছাড়াও কাজ করছে

— OMGPOP

এটি $scope.$parentযা আমার জন্য কৌণিক 1.3.20 এ কাজ করে

— র‌্যাডটেক

Answer 4

প্যারেন্ট এবং সাব স্কোপ ডেটা মিশ্রিত না করে কীভাবে এই সমস্যাটি নিয়ে কাজ করবেন তা আমি খুঁজে বের করেছি। উপাদানটির ng-ifউপর একটি ng-includeসেট করে স্কোপ ভেরিয়েবলে সেট করুন। উদাহরণ স্বরূপ :

<div ng-include="{{ template }}" ng-if="show"/>

আপনার নিয়ামকটিতে, আপনি যখন আপনার সাব স্কোপে প্রয়োজনীয় সমস্ত ডেটা সেট করে রেখেছেন তখন তার উপর শো সেট করুন true। ng-includeএই মুহূর্তে আপনার সুযোগ ডেটা সেট কপি এবং আপনার সাব সুযোগ এটি সেট হবে।

থাম্বের নিয়ম হ'ল স্কোপ ডেটা স্কোপ ডেটা হ্রাস করা, অন্যথায় আপনার এই পরিস্থিতি রয়েছে।

ম্যাক্স

Comments

আমি এই পদ্ধতির অনুরূপ সমস্যার জন্য ব্যবহার করছি তবে এটি সব ক্ষেত্রেই উপযুক্ত নয়। বিশেষত যখন আপনি অন্তর্ভুক্ত উপাদানটি কখনই লুকিয়ে না

— পড়তে চান