अगर आपको अधिक जानकारी चाहिए या मुझे कुछ भी स्पष्ट करना चाहते हैं तो कृपया मुझे बताएं। मैंने इसे समझने के लिए कई अलग-अलग चीजों की कोशिश की है लेकिन समाधान नहीं मिला है।एंजुलरजेएस दो-तरफा डेटा बाध्यकारी नेस्टेड निर्देशों में
मैं कोणीय जेएस के लिए अपेक्षाकृत नया हूं और मैं डेटा की कई परतों के साथ एक ऐप बनाने की कोशिश कर रहा हूं। मेरे पास नियंत्रक पेज कंट्रोलर पर शरीर के दायरे में संग्रहीत कुछ मूल उपयोगकर्ता जानकारी है। मेरे पास एक सेटिंग फॉर्म है जो $ रूट पैराम (नियंत्रक सेटिंग्स नियंत्रक के साथ) का उपयोग करने में लोड होता है जिसमें टेम्पलेटिंग उद्देश्यों के लिए कुछ कस्टम निर्देश शामिल हैं। चूंकि निर्देश निहित हैं, इसलिए मैं पहले के अंदर दूसरे को लोड करने के लिए ट्रांसक्यूलेशन का उपयोग कर रहा हूं। ऐसा लगता है कि यह सब ठीक काम कर रहा है।
मेरे समस्या यह है कि मैं अंतरतम निर्देश के भीतर से क्षेत्र user.firstname संदर्भित करने के लिए कोशिश कर रहा हूँ और पाठ बॉक्स में किए गए PageController दायरे में मूल्य पैदा करने के लिए और साथ ही बदलने के लिए परिवर्तन की अनुमति के लिए दो तरह से डेटा बाइंडिंग का उपयोग करना चाहते है। मुझे पता है कि इस तरह की कई समस्याएं एनजी-मॉडल में प्राइमेटिव्स का उपयोग करके होती हैं, लेकिन मैंने सबकुछ एक अतिरिक्त ऑब्जेक्ट में डालने का प्रयास किया है ताकि मैं प्रोटोटाइप विरासत को किसी भी लाभ के लिए ट्रिगर कर सकूं। मुझसे यहां क्या गलत हो रहा है?
यहां मेरे कोड का JSFiddle है, जो समस्या को अलग करने के लिए जितना संभव हो सके उतना नीचे छीन लिया गया है। इस उदाहरण में, यदि मैं बाहरी टेक्स्टबॉक्स में टाइप करता हूं, जो सीधे पेजकंट्रोलर स्कोप पर है, तो वह उस टेक्स्टबॉक्स को तब तक संशोधित करेगा जब तक कि टेक्स्टबॉक्स संशोधित नहीं होता है, जिस पर कनेक्शन टूटा हुआ है। यह अन्य प्रश्नों में वर्णित प्राइमेटिव्स का उपयोग करने की समस्या की तरह लगता है, लेकिन मैं यह नहीं समझ सकता कि समस्या कहां है।
HTML:
<body class="event-listing" ng-app="app" ng-controller="PageController">
<div class="listing-event-wrap">
<input type="text" ng-model="user.firstname" />
<div ng-controller="SettingsController">
<section block title="{{data.updateInfo.title}}" description="{{data.updateInfo.description}}">
<div formrow label="{{data.updateInfo.labels.firstname}}" type="textInput" value="user.firstname"></div>
</section>
</div>
</div>
</body>
कोणीय निर्देशों:
app.directive('formrow', function() {
return {
scope: {
label: "@label",
type: "@type",
value: "=value"
},
replace: true,
template: '<div class="form-row">' +
'<div class="form-label" data-ng-show="label">{{label}}</div>' +
'<div class="form-entry" ng-switch on="type">' +
'<input type="text" ng-model="value" data-ng-switch-when="textInput" />' +
'</div>' +
'</div>'
}
});
app.directive('block', function() {
return {
scope: {
title: "@title",
description: "@description"
},
transclude: true,
replace: true,
template: '<div class="page-block">' +
'<h2 data-ng-show="title">{{title}}</h2>' +
'<p class="form-description" data-ng-show="description">{{description}}</p>' +
'<div class="block-inside" data-ng-transclude></div>' +
'</div>'
}
});
कोणीय नियंत्रकों: तो
app.controller("PageController", function($scope) {
$scope.user = {
firstname: "John"
};
});
app.controller("SettingsController", function($scope) {
$scope.data = {
updateInfo: {
title: "Update Your Information",
description: "A description here",
labels: {
firstname: "First Name"
}
}
}
});
इतनी त्वरित प्रतिक्रिया के लिए धन्यवाद! मैंने बेवकूफ़ों की कोशिश की लेकिन ऐसा लगता है कि मैंने पोस्ट किया है। एक समारोह में इसे बदलने का लक्ष्य क्या है? – princjef
मैंने refobj जोड़ा ताकि आपको निर्देश के भीतर 'firstname' को कॉल करने की आवश्यकता न हो क्योंकि मुझे यकीन है कि आप इसे सामान्य बनाना चाहते हैं। – Nir
यह वास्तव में चालाक है! डॉट के बजाय सरणी नोटेशन का उपयोग करने के बारे में सोचा नहीं था। यह मेरी जरूरतों के लिए काम करेगा। धन्यवाद! – princjef