2013-07-22 22 views
10

के लिए विधियां प्रदान करना मैंने हाल ही में एक सीखने के अभ्यास के रूप में कोणीय लिया है।कोणीय: एनजी-मॉडल

मैं ng-model पर एक विधि या एक अभिव्यक्ति को पास करना चाहता हूं जो एक का मूल्यांकन कर सकता है।

इस बेला http://jsfiddle.net/C4aGk/ में आप है कि मैं कड़ी मेहनत ng-model="record.inner[0].text" के रूप में क्षेत्र कोड जोड़ने के बाद देखेंगे और यह काम करता है, अब बात यह है कि मैं बदलना चाहते हैं, हार्ड-कोडेड कुछ है कि रन पर दिया जाता है के साथ शून्य समय, एक मानदंड द्वारा चुना गया id = 1 कहते हैं।

मेरे एचटीएमएल कोड:

<div ng-controller="MainController" ng-app> 
    <div ng-repeat="record in records"> 
     <input ng-model="record.inner[0].text"> <span>{{record.outer}}</span> 
     <div ng-repeat="nested in record.inner">{{nested.id}} - {{nested.text}}</div> 
     <hr /> 
    </div> 
</div> 
<br/> 

और इसी js:

function MainController($scope) { 
    $scope.records = [{ 
     outer: "Hello", 
     inner: [{ 
      id: 1, 
      text: "Angular" 
     }, { 
      id: 2, 
      text: "jQuery" 
     }] 
    }, { 
     outer: "World", 
     inner: [{ 
      id: 1, 
      text: "Node.js" 
     }, { 
      id: 2, 
      text: "Underscore.js" 
     }] 
    }]; 

    $scope.getText = function (record) { 
     var index = 0; 
     for (nested in record.inner) { 
      if (nested.id === 1) { 
       return "record.inner[" + index + "].text"; 
      } 
      index++; 
     } 
    }; 

मुझे कोई सफलता के साथ प्रति https://groups.google.com/forum/#!topic/angular/Pef6LY2rT7g रूप ng-model="getText(record)" रखने की कोशिश की है, और एक और खोज इस https://github.com/angular/angular.js/pull/1328 जो समान रूप से है कर दिया मेरे लिए असहाय

किसी भी मदद की अत्यधिक सराहना की जाएगी।

+2

आपको अपने 'getText' फ़ंक्शन में एक बग मिला है। 'के लिए/loops जावास्क्रिप्ट में इस तरह काम नहीं करते हैं। आपको if if को if if (record.inner [nested] .id === 1) {'में बदलना होगा। किसी भी तरह से, यह आपकी पूरी समस्या को ठीक नहीं करेगा। यह वर्णन करना बेहतर हो सकता है कि आप क्या करने की कोशिश कर रहे हैं और यह नहीं कि आप इसे कैसे करने की कोशिश कर रहे हैं। उदाहरण के लिए, यदि आप संपादन बटन पर क्लिक करने के बाद उपयोगकर्ता को [0] या [1] संपादित करने की कोशिश कर रहे हैं, तो यह अलग-अलग फ़ील्ड रखने के लिए, अंगुलर में बेहतर/आसान होगा, जो आप दिखाते/छिपाते हैं। – Langdon

+0

गलती को पकड़ने के लिए @ लैंगडन धन्यवाद, मैं आम तौर पर 'इन/इन' लूप से बचता हूं इसलिए मैं थोड़ा सा जंगली हूं। मैं एंगुलर जेएस के लिए डैन वाहिलिन की मार्गदर्शिका का अनुसरण कर रहा हूं और मैं प्रस्तुति में संदर्भित ग्राहक ऐप को रीमेक करने का प्रयास कर रहा था, जब यह मेरे लिए प्रयास किया गया था और चूंकि मैंने उद्धृत लिंक के अनुसार काम किया होगा। मैंने सोचा कि यह कुछ ऐसा होना चाहिए जो मैं गलत कर रहा हूं। मैं इस समय निर्देशों की तलाश कर रहा हूं, यही वह सवाल है जहां से सवाल आया था। :) – adeelx

उत्तर

11

जो कुछ भी आप एनजी-मॉडल में पास करते हैं उसे दायरे के खिलाफ कोणीय अभिव्यक्ति के रूप में मूल्यांकन किया जाता है। इसका मतलब है कि record.inner[0].text का मूल्यांकन $scope.record.inner[0].text के रूप में किया जाता है और फिर उस अभिव्यक्ति का परिणाम उपयोग किया जाता है। जब आप getText(record) का उपयोग करते हैं, कोणीय $scope.getText(record) का मूल्यांकन करता है और एनजी-मॉडल इस मूल्यांकन के परिणाम तक पहुंच प्राप्त करता है। ध्यान रखें कि एनजी-मॉडल इस फ़ंक्शन कॉल के परिणाम का मूल्यांकन नहीं करता है।

आपकी समस्या यह है कि आप परिणाम को कोणीय अभिव्यक्ति स्ट्रिंग के रूप में वापस कर रहे हैं, लेकिन इसका मूल्यांकन कभी नहीं कर रहे हैं, इसलिए एनजी-मॉडल को एक स्ट्रिंग दी गई है जिसका उपयोग नहीं किया जा सकता है। इस से निपटने के लिए अपने कोड को फिर से डिजाइन करने के कई तरीके हैं, लेकिन सरल (और शायद सबसे अच्छा नहीं) तरीका फ़ंक्शन कॉल के परिणाम प्राप्त करने के लिए एनजी-इनिट जैसे कुछ का उपयोग करना होगा और फिर उस परिणाम को एनजी- आदर्श। एक त्वरित उदाहरण के लिए यह पहेली देखें http://jsfiddle.net/z5z9s/

+2

मुझे नहीं लगता कि 'ng-model = "{{scopeFunctionThatReturnsAString()}}" 'काम करना चाहिए। क्या आपके पास इसका एक उदाहरण है? – Langdon

+0

@ लैंगडन आप सही हैं। इसे पकड़ने के लिए धन्यवाद! मैं अपना जवाब ठीक कर दूंगा। – Jon7

+0

समाधान के लिए धन्यवाद, अगर कुछ भी बेहतर नहीं है तो मैं बस इसके साथ जा सकता हूं। यदि आपको समझा नहीं जाता है, तो कोणीय दस्तावेज कहता है 'ngModel - {string} - डेटा-बाइंड करने के लिए असाइन करने योग्य कोणीय अभिव्यक्ति।', अगर मैंने ऐसा नहीं किया तो यह क्या दर्शाता है? मैं 'एनजी-मॉडल' निर्देश में काम करने के लिए कोई भी काम नहीं कर पा रहा हूं। – adeelx