Angular.js: डीएल / डीडी / डीटी के साथ दोहराएँ

दूसरा यह। मुझे यह समस्या कुछ समय से हो रही है।

@IgorMinar ने टिप्पणी-आधारित एनजी-रिपीट (https://github.com/angular/angular.js/pull/1646) पर कुछ काम किया, लेकिन चूंकि टिप्पणियां सभी ब्राउज़रों पर इतनी अच्छी तरह से नहीं चलती हैं, इसलिए इसकी संभावना नहीं है विलय होना। इसके बजाय वे एक वैकल्पिक समाधान की तलाश कर रहे हैं, शायद या तो "स्टार्ट और एंड रिपीट टैग" या "स्टार्ट-रिपीट और लेबल को दोहराने के लिए तत्वों की संख्या"

{{ }} जैसे जोड़ियों के अंदर टेम्प्लेट की अनुमति देने के बारे में कैसे

शायद:
{{! एनजी-रिपीट = "फू इन एल"

संबंधित नोट पर, मेरे पास एक समान समस्या है क्या दूसरे इंटरपोलेशन फॉर्म में बड़ी तकनीकी चुनौतियां होंगी
जैसे {{{ }}} जो html वर्णों से नहीं बचते हैं, लेकिन a . भी नहीं बनाते हैं
नई अवधि?

मंगलवार, 29 जनवरी, 2013 को दोपहर 12:38 बजे, पीट बेकन डार्विन <
सूचनाएं@github.com> ने लिखा:

@IgorMinar https://github.com/IgorMinar ने a . पर कुछ काम किया
टिप्पणी-आधारित एनजी-रिपीट (#1646https://github.com/angular/angular.js/issues/1646)
लेकिन चूंकि टिप्पणियां सभी ब्राउज़रों पर इतनी अच्छी तरह से नहीं चलती हैं, इसलिए इसकी संभावना नहीं है
विलय किया जाए। इसके बजाय वे एक वैकल्पिक समाधान की तलाश कर रहे हैं, शायद
या तो "स्टार्ट और एंड रिपीट टैग्स" या "स्टार्ट-रिपीट और की संख्या" के साथ
लेबल दोहराने के लिए तत्व"

-
इस ईमेल का सीधे उत्तर दें या इसे Gi tHubhttps: //github.com/angular/angular.js/issues/1891#issuecomment -12856484 पर देखें।

मैं बस इस मुद्दे में एक टेबल के साथ भाग गया जो एक सरणी में प्रति ऑब्जेक्ट दो 'टीडी' तत्व उत्पन्न करना चाहता है।

+1 इस सुविधा को जोड़ने के लिए। बस इसी सीमा में भाग गया।

:थम्स अप:

वही समस्या है। मुझे "एनजी-रिपीट-चिल्ड्रन" जैसा कुछ देखना अच्छा लगेगा, केवल बच्चों को दोहराते हुए लेकिन वर्तमान तत्व या एक प्रकार का "एनजी-ओमिट-टैग" (जो वर्तमान टैग को हटा देता है लेकिन बच्चों को जगह में छोड़ देता है) का उपयोग करने के लिए एनजी-रिपीट के साथ। यह इस समस्या को हल करने के लिए उत्पन्न कई अमान्य मार्कअप से बच जाएगा।

जिस सीमा पर चर्चा हो रही है उसे पूरी तरह से न समझें। मूल तत्व पर एनजी-रिपीट डालने से काम क्यों होता है? http://jsfiddle.net/JyWdT/13/
क्या कोई ऐसी पहेली बना सकता है जो इस मुद्दे को और विस्तार से बताए?

lgalfaso, आपकी पहेली एक परिभाषा के साथ कई परिभाषा सूची बनाती है। वांछित आउटपुट कई परिभाषाओं के साथ एक परिभाषा सूची है।

या मेरे मामले में, मुझे एक सरणी में प्रत्येक आइटम के लिए "td" तत्वों की एक जोड़ी बनाने की आवश्यकता है।
कहो मेरे पास एक सरणी है,

[{name:dan, age:15}, {name:steve, age:21}]

और मुझे आउटपुट करने की ज़रूरत है:

<tr><td>dan</td><td>15</td><td>steve</td><td>21</td></tr>

इस समय कोणीय के साथ इसे पूरा करने का कोई तरीका नहीं है।

क्या आप tr तत्व पर ng-repeat डालकर ऐसा नहीं कर सकते?

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

सूर्य, पर 2:24 PM पर अप्रैल 21, 2013 को zilles [email protected] लिखा है:

lgalfaso, आपकी पहेली एक के साथ कई परिभाषा सूचियाँ बनाती है
परिभाषा। वांछित आउटपुट एकाधिक के साथ एक परिभाषा सूची है
परिभाषाएं

या मेरे मामले में, मुझे प्रत्येक आइटम के लिए "td" तत्वों की एक जोड़ी बनाने की आवश्यकता है
एक सरणी।
कहो मेरे पास एक सरणी है,

[{ नाम: डैन , उम्र: १५ }, { नाम: स्टीव , उम्र: २१ }]

और मुझे आउटपुट करने की ज़रूरत है:

सज्जन15स्टीव21

इस समय कोणीय के साथ इसे पूरा करने का कोई तरीका नहीं है।

-
इस ईमेल का सीधे उत्तर दें या इसे Gi tHub पर देखेंhttps://github.com/angular/angular.js/issues/1891#issuecomment -16716788
.

ओह, मैं देखता हूं, मेरी पिछली टिप्पणी पर ध्यान न दें
२१ अप्रैल २०१३ को सुबह ९:०९ बजे "जेसन तुरिम" जेसन। [email protected] ने लिखा:

क्या आप tr तत्व पर ng-repeat डालकर ऐसा नहीं कर सकते?

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

सूर्य, पर 2:24 PM पर अप्रैल 21, 2013 को zilles [email protected] लिखा है:

lgalfaso, आपकी पहेली एक के साथ कई परिभाषा सूचियाँ बनाती है
परिभाषा। वांछित आउटपुट एकाधिक के साथ एक परिभाषा सूची है
परिभाषाएं

या मेरे मामले में, मुझे प्रत्येक आइटम के लिए "td" तत्वों की एक जोड़ी बनाने की आवश्यकता है
एक सरणी।
कहो मेरे पास एक सरणी है,

[{ नाम: डैन , उम्र: १५ }, { नाम: स्टीव , उम्र: २१ }]

और मुझे आउटपुट करने की ज़रूरत है:

सज्जन15स्टीव21

इस समय कोणीय के साथ इसे पूरा करने का कोई तरीका नहीं है।

-
इस ईमेल का सीधे उत्तर दें या इसे Gi tHub पर देखेंhttps://github.com/angular/angular.js/issues/1891#issuecomment -16716788
.

जैसा कि मैं सिर्फ dl / dt + dd समस्या का सामना करता हूं, मैं पुष्टि करता हूं कि एक नया एनजी-रिपीट-चिल्ड्रन (या एनजी-रिपीट-इनर) एक लापता अनिवार्य निर्देश है।

+1

एक नए निर्देश के लिए प्रस्ताव एनजी-रिपीट-इनर। यदि यह प्रस्ताव ठीक है तो सभी गाइडों को संशोधित कर देगा

मुझे लगता है कि उसी ng-repeat निर्देश का उपयोग करना बेहतर होगा, लेकिन उस निर्देश को HTML टिप्पणियों पर उपयोग करने की अनुमति दें, जैसा कि मूल पोस्ट से पता चलता है।

ऐसा कुछ तब काम करना चाहिए:

<dl>
  <!-- ng-repeat="(name, definition) in myList" -->
  <dt>{{name}}</dt>
  <dd>{{definition}}</dd>
  <!-- /ng-repeat -->
</dl>

यह निश्चित नहीं है कि दोहराए जाने वाले ब्लॉक की शुरुआत और अंत कैसे हासिल किया जाएगा ( <!-- /ng-repeat --> @ProLoser द्वारा सुझाया गया था), लेकिन मुझे लगता है कि HTML टिप्पणियों का उपयोग करना एक सुंदर समाधान होगा।

यह देखते हुए कि मिनीफायर टिप्पणियों और अन्य मुद्दों को टिप्पणियों के साथ मार सकते हैं, I
मत सोचो कि यह बहुत अच्छा है। हालाँकि, मुझे एनजी-रिपीट का उपयोग करने का विचार पसंद है।
क्या एक विशेषता एनजी-रिपीट-सिंगल-रूट या शामिल करना संभव होगा?
कुछ ऐसा जो सत्य पर सेट होने पर बिना रूट के एनजी-रिपीट चलाएगा
तत्व? उदाहरण के लिए:

{मैं}

{मैं}

बन जाएगा:

1

1

2

2

3

3

मंगलवार, २३ अप्रैल २०१३ को अपराह्न ३:५४ बजे, मणि ताडयों ने नोटिफ़िकेशन @github.com लिखा:

मुझे लगता है कि समान एनजी-रिपीट निर्देश का उपयोग करना बेहतर होगा, लेकिन अनुमति दें
मूल पोस्ट के रूप में HTML टिप्पणियों पर उस निर्देश का उपयोग करने के लिए
सुझाव देता है।

ऐसा कुछ तब काम करना चाहिए:

{{नाम}}

{{परिभाषा}}

निश्चित नहीं है कि ब्लॉक की शुरुआत और अंत को कैसे दोहराया जाए
हासिल किया जाएगा (मैंने इसे बनाया है)मेरे उदाहरण में),
लेकिन मुझे लगता है कि HTML टिप्पणियों का उपयोग करना एक सुंदर समाधान होगा।

-
इस ईमेल का सीधे उत्तर दें या इसे Gi tHub पर देखेंhttps://github.com/angular/angular.js/issues/1891#issuecomment -16891970
.

मैक्सकैन, मैं "एकल-रूट" के फायदे देख सकता हूं, क्योंकि आप स्रोत एचटीएमएल को वैध रखते हैं, लेकिन वह निर्माण आपको "डीएल" टैग के अंदर कुछ और जोड़ने नहीं देता है ... उदाहरण के लिए एक निश्चित परिभाषा जो आप चाहते हैं गतिशील परिभाषाओं के अपने पाश से पहले शामिल करने के लिए। lgalfaso का समाधान इसे संभाल लेगा।

@maxcan एक बड़े

मुझे @bowsersenior का सुझाव पसंद है, लेकिन मैं इसे समापन टिप्पणी के रूप में पसंद करूंगा: <!-- /ng-repeat -->

प्रदर्शन हिट पर यह शर्म की बात है। वैसे भी, मैं पुरजोर समर्थन करता हूँ
@lgalfaso का समाधान, यह मानते हुए कि आप निर्देश को एक div में डाल सकते हैं और नहीं
बस एक टिप्पणी..

बुधवार, 24 अप्रैल, 2013 को दोपहर 1:58 बजे, डीन सोफर नोटिफिकेशन @github.comलिखा:

मुझे @bowsersenior https://github.com/bowsersenior का सुझाव पसंद है, लेकिन
मैं इसे समापन टिप्पणी के रूप में पसंद करूंगा:

-
इस ईमेल का सीधे उत्तर दें या इसे Gi tHub पर देखेंhttps://github.com/angular/angular.js/issues/1891#issuecomment -16964155
.

मैं @ProLoser से सहमत <!-- /ng-repeat --> HTML टिप्पणी दृष्टिकोण में एक बेहतर समापन टैग है। एक नोट, कोणीय HTML टिप्पणियों में निर्देशों को परिभाषित करने की अनुमति देता है, इसलिए मुझे नहीं लगता कि इस समस्या के संभावित समाधान के रूप में HTML टिप्पणियों को त्याग दिया जा सकता है। ध्यान रखें कि कोर कोणीय डेवलपर्स ने संकेत दिया कि उन्होंने इस स्टैक ओवरफ़्लो प्रश्न में इस मुद्दे को हल करने के लिए HTML टिप्पणियों का उपयोग करने की योजना बनाई है (जैसा कि मूल पोस्टर द्वारा बताया गया है):

• http://stackoverflow.com/a/10458127/457819

जब तक ऐसा करने का कोई तरीका नहीं है, तब तक मुझे उन्हें त्यागने में कोई फर्क नहीं पड़ता
टिप्पणियाँ।

24 अप्रैल, 2013 को दोपहर 2:41 बजे, मणि ताडयों ने नोटिफिकेशन @github.com लिखा:

मैं @ProLoser https://github.com/ProLoser से सहमत हूं कि एचटीएमएल टिप्पणी दृष्टिकोण में एक बेहतर समापन टैग है। एक
ध्यान दें, कोणीय HTML टिप्पणियों में निर्देशों को परिभाषित करने की अनुमति देता है, इसलिए मैं नहीं करता
लगता है कि इसके लिए संभावित समाधान के रूप में HTML टिप्पणियों को त्याग दिया जा सकता है
संकट। ध्यान रखें कि कोर कोणीय डेवलपर्स ने संकेत दिया है कि
इस स्टैक ओवरफ़्लो में इस समस्या को हल करने के लिए HTML टिप्पणियों का उपयोग करने की योजना बनाई है
प्रश्न (जैसा कि मूल पोस्टर द्वारा बताया गया है):

• http://stackoverflow.com/a/10458127/457819

-
इस ईमेल का सीधे उत्तर दें या इसे Gi tHub पर देखेंhttps://github.com/angular/angular.js/issues/1891#issuecomment -16969268
.

+1 से @lgalfaso का एनजी-रिपीट-इनर। मुझे अंत में कुछ ऐसा चाहिए जो बस इसे पूरा करे।

नॉकआउट टिप्पणियों के साथ ऐसा करता है। मैं कुछ ऐसा पोर्ट करने की कोशिश कर रहा हूं जो मैंने नॉकआउट में डीएल टैग के साथ किया था और ऐसा लगता है कि जब तक इस मुद्दे को संबोधित नहीं किया जाता है तब तक यह संभव नहीं है।

यह मेरी राय है, इसलिए @mhevery या @IgorMinar के इनपुट के बिना, इसे नमक के दाने के साथ लें।
मैं देखता हूं कि टिप्पणियों के साथ एनजी-रिपीट काम करना अधिक लचीला है, किसी भी तरह यह $ कंपाइलर में बदलाव के बिना स्वाभाविक नहीं दिखता है, इसलिए यह "टिप्पणियों के बीच" प्रकार के निर्देश को संभाल सकता है। इसका कारण यह है कि यह अजीब लगता है कि एक निर्देश को घोंसले के शिकार और उस तत्व के बाहर देखने की आवश्यकता होती है जो उसे वह करने के लिए दिया जाता है जो उसे माना जाता है

यदि कोई टिप्पणी/कोई टिप्पणी चल रहे विवाद का कारण नहीं है, तो क्या हम उन दोनों को नहीं रख सकते हैं? मुझे यह समझना मुश्किल लगता है कि इस तरह के एक सामान्य मुद्दे को 3 महीने से अधिक समय तक संबोधित नहीं किया गया है। यदि इसके पीछे का कारण मुख्य रूप से कार्यान्वयन पर विवाद के कारण है, तो कुछ और "इष्टतम" के लिए कुछ भी नहीं के साथ लंबे समय तक प्रतीक्षा करने के बजाय वास्तव में कुछ लागू (और शायद भविष्य में अद्यतन/जोड़ा गया) करना अधिक बेहतर लगता है।

हालांकि ज्यादातर मामलों में, मुझे ऐसा लगता है कि अगर एनजी-रिपीट-इनर एक निश्चित चीज़ के "भीतर" तत्वों के एक सेट को दोहराने के लिए संदर्भित करता है, तो इसका मतलब है कि ज्यादातर मामलों में आप पहले से ही किसी प्रकार का एक विशेष बाहरी कंटेनर बना चुके हैं। इसलिए जब एक टिप्पणी कार्यान्वयन अधिक बहुमुखी हो सकता है (यद्यपि कोड की एक अतिरिक्त 1/2 पंक्तियाँ जो मैं संभव से बचना चाहूंगा), मुझे लगता है कि इसका उपयोग कम किया जा सकता है (और शायद कम प्राथमिकता दी जानी चाहिए) एक इन-एलिमेंट निर्देश।

HTML टिप्पणियों का उपयोग करने के मुद्दे का इस तथ्य से कोई संबंध नहीं है कि यह मुद्दा कुछ महीनों से बकाया है। मुझे लगता है कि इस मुद्दे को तय करने और समाधान को लागू करने के लिए कोणीय अनुरक्षकों से कुछ ध्यान देने की जरूरत है।

यदि आप इसे चूक गए हैं, तो टिप्पणी-आधारित पुनरावर्तकों के साथ समस्याओं के बारे में https://github.com/angular/angular.js/pull/1646 यहां @lgalfaso समाधान इस बिंदु पर बहुत अधिक आशाजनक है।

#1646 को इंगित करने के लिए धन्यवाद। उस चर्चा में @mhevery द्वारा एक टिप्पणी है जो बिना किसी कोड (शायद एक स्वरूपण त्रुटि) दिखाए बिना "इसे करने का एक बेहतर तरीका" प्रस्तावित करती है:

काश हम जानते कि वह "बेहतर तरीका" क्या था!

कोर टीम में आम सहमति यह है कि वर्तमान में इस समस्या से निपटने का सबसे अच्छा तरीका निम्न में से एक है (हमने सिंटैक्स पर समझौता नहीं किया है लेकिन इन सभी के लिए कार्यान्वयन लगभग समान है):

इन सभी उदाहरणों में दो td टैग हैं, मैंने इसे उद्देश्य पर किया, भले ही यह अवैध है क्योंकि मैं यह दिखाना चाहता था कि पुनरावर्तक को तत्वों की मनमानी संख्या को दोहराने की अनुमति देनी चाहिए - इस उदाहरण को तालिका का उपयोग करने के लिए परिवर्तित करना बेहतर होगा और तालिका पंक्तियाँ, लेकिन मैं अब ऑफ़लाइन होने वाला हूँ और उनके पास उन्हें पुन: सक्रिय करने का समय नहीं है।

सिंटैक्स ए:

<dl>
  <dt ng-repeat="(name, definition) in myList">{{name}}</dt>
  <dd ng-repeat-next>{{definition}}</dd>
  <dd ng-repeat-next>{{definition}}</dd>
</dl>

सिंटेक्स बी:

<dl>
  <dt ng-repeat-start="(name, definition) in myList">{{name}}</dt>
  <dd>{{definition}}</dd>
  <dd ng-repeat-end>{{definition}}</dd>
</dl>

सिंटेक्स सी:

<dl>
  <dt ng-repeat="(name, definition) in myList" ng-repeat-start>{{name}}</dt>
  <dd>{{definition}}</dd>
  <dd ng-repeat-end>{{definition}}</dd>
</dl>

सिंटेक्स डी:

<dl>
  <dt ng-repeat="(name, definition) in myList" ng-repeat-group>{{name}}</dt>
  <dd ng-repeat-group>{{definition}}</dd>
  <dd ng-repeat-group>{{definition}}</dd>
</dl>

लंबे समय तक, एक बार हमारे पास बेहतर ब्राउज़र समर्थन होने के बाद, हम नए <template> तत्व का उपयोग करना शुरू कर देंगे जो हमें बस यह करने की अनुमति देगा:

सिंटेक्स एक्स:

<template>
  <dl>
    <ng repeat="(name, definition) in myList">
      <dt>{{name}}</dt>
      <dd>{{definition}}</dd>
      <dd>{{definition}}</dd>
    </ng>
  </dl>
</template>

अगर कोई इस समाधान के लिए पीआर तैयार करना चाहता है, तो उसका विलय हो जाएगा। इसके अलावा, यदि आपके पास किसी विशेष वाक्यविन्यास के लिए प्राथमिकता है तो कृपया बोलें।

इनपुट के लिए धन्यवाद। मेरे दृष्टिकोण से, निम्नलिखित की तरह नेस्टेड लूप के लिए सिंटैक्स ए स्पष्ट नहीं है:

<dl>
  <dt ng-repeat="...">loop 1</dt>
  <dt ng-repeat="..." ng-repeat-next>loop 2</dt>
  <dd ng-repeat-next>is this within loop 2 or only loop 1</dd>
</dl>

सिंटैक्स बी और सी लगभग समान हैं, मुझे दोनों विकल्प पसंद हैं (यहां तक ​​​​कि जब मुझे लगता है कि सिंटैक्स बी किसी तरह बेहतर है)

जब तक मुझे कुछ याद नहीं आ रहा है, सिंटैक्स डी में सिंटैक्स ए के समान नेस्टेड लूप समस्याएं हैं

यदि संभव हो तो मैं बी के लिए जाऊंगा, विशुद्ध रूप से कम से कम पत्र लिखने के कारण। यह सबसे सममित भी दिखता है - मुझे लगता है कि दृश्य समरूपता के कारण इसे प्रबंधित करना सबसे आसान होगा।

lgalfasos की टिप्पणी एक दिलचस्प दुविधा की ओर इशारा करती है। क्या होगा यदि उसके उदाहरण में नेस्टेड लूप दूसरे के बजाय पहले तत्व पर है। तब सिंटेक्स के सभी संस्करण अब अस्पष्ट हैं, जब तक कि मुझे कुछ याद नहीं आ रहा है।

मैं सिंटैक्स एक्स में @lgalfaso के प्रस्तावित ng-repeat-inner और ng repeat बीच के अंतर को बिल्कुल नहीं समझता, हालांकि <template> रैपिंग। क्या कोई समझा सकता है?

मुझे यकीन नहीं है कि मैं इसे समझता हूं, लेकिन मुझे लगता है कि <ng> टैग डोम का हिस्सा नहीं बनता है, इस प्रकार dl तहत एक अवैध नेस्टिंग संरचना से बचा जाता है।

प्रस्तावित वाक्यविन्यास के लिए, मैं बी के लिए वोट दूंगा।

मेरा मानना ​​​​है कि सिंटैक्स एक्स केस एक सामान्य डमी रैपर तत्व <ng> देता है जो डीओएम का हिस्सा नहीं है और विभिन्न निर्देशों की मेजबानी कर सकता है। यह ng-repeat-inner से अधिक सामान्य है, जो केवल ng-repeat लिए एक विशिष्ट उपयोग के मामले पर लागू होता है।

यदि सिंटैक्स एक्स, दीर्घकालिक उद्देश्य, ng-repeat-inner एक अधिक सामान्य संस्करण है, तो मुझे लगता है कि प्रस्तावित ए, बी में से एक के साथ ng-repeat-inner भी अपनाया जाना चाहिए (* पूरी तरह से नहीं), सी, डी निम्नलिखित के लिए:

1. सिंटैक्स X और ng-repeat-inner दोनों में समान डोम संरचना है
   : यदि सिंटैक्स एक्स दीर्घकालिक उद्देश्य है, तो भविष्य में रिफैक्टरिंग को रोकने के लिए अब कुछ ऐसा होना अच्छा होगा जो संरचना-वार को इसी तरह संरेखित करता है।
2. ज्यादातर मामलों में ng-repeat-inner वैसे भी पर्याप्त होगा
   : इरादा आंतरिक तत्वों को दोहराने के लिए एक बाहरी कंटेनर बनाना है।

@ daegon123 किसी भी @IgorMinar के सूचीबद्ध ng-repeat-inner बीच का अंतर यह है कि सिंटैक्स आपको एक अलग कंटेनर के बिना तत्वों के एक सेट को मनमाने ढंग से दोहराने देता है। उदाहरण के लिए, <tr> s का एक सेट दोहराएं जबकि table या tbody अन्य गैर-दोहराए जाने वाले <tr> s हैं। उस स्थिति में, दोहराए जाने वाले तत्वों में ng-repeat-inner को बाध्य करने के लिए एक अलग अभिभावक नहीं होता है।

<table>
    <thead>...</thead>
    <tr ng-repeat-start="(name, definition) in myList">...</tr>
    <tr>...</tr>
    <tr ng-repeat-end>...</tr>
    <tr>...</tr>
    <tfoot>...</tfoot>
</table>

या <dl> में प्रति ऑब्जेक्ट एकाधिक परिभाषाएं

<dl>
    <dt ng-repeat-start="...">{{item.term1}}</dt>
    <dd>{{item.def1}}</dd>
    <dt>{{item.term2}}</dt>
    <dd>{{item.def2}}</dd>
    <dt>{{item.term3}}</dt>
    <dd ng-repeat-end>{{item.def3}}</dd>
</dl>

@ es128 टिप्पणियों और कोड के लिए धन्यवाद। यही कारण है कि मैंने प्रस्तावित किया कि ng-repeat-inner को अन्य सूचीबद्ध वाक्यविन्यासों में से एक के साथ 'स्वीकार' किया जाए, लेकिन आपकी टिप्पणियों में वास्तविक कोड देखकर मुझे आश्चर्य होने लगा है कि क्या ng-repeat-inner की भी आवश्यकता है। अगर मुझे कुछ मिलता है तो मैं एक और टिप्पणी पोस्ट करूंगा - धन्यवाद फिर से!

एनजी-रिपीट-इनर के साथ समस्या यह है कि इसका उपयोग सभी मामलों में नहीं किया जा सकता है, उदाहरण के लिए:

<ul>
  <li>some static prefix item</li>
  <!-- repeat these nodes -->
    <li>{{ something }}</li>
    <li>{{ something else }}</li>
  <!-- repeat end -->
  <li>some static postfix item</li>
</ul>

क्योंकि आप एक कृत्रिम तत्व (जैसे div) को उल (प्रति html कल्पना) में नहीं डाल सकते हैं, एनजी-रिपीट-इनर का उपयोग यहां नहीं किया जा सकता है।

टेम्पलेट तत्व के साथ बीटीडब्ल्यू, हम उल और ली के बीच एक कृत्रिम तत्व डाल पाएंगे।

इसके अलावा सिंटैक्स एक्स से बहुत अधिक संलग्न न हों, यह सिर्फ एक त्वरित और गंदा उदाहरण था कि हम अंततः सटीक वाक्यविन्यास करने में सक्षम होंगे, लेकिन अभी तक चर्चा नहीं की गई है, लेकिन जब मैं इसमें हूं, तो यहां एक और है एक:

सिंटैक्स वाई:

<ul>
  <li>some static prefix item</li>
  <template repeat="item in items">
    <li>{{ item.name }}</li>
    <li>{{ item.owner }}</li>
  </template>
  <li>some static postfix item</li>
</ul>

एनजी-रिपीट ग्रुप में आईडी सेट करने के बारे में क्या?
तब हम किसी भी स्तर से वस्तुओं को स्वतंत्र रूप से संलग्न कर सकते थे। कुछ इस तरह

<dl>
    <dt ng-repeat="item in items" ng-repeat-group="someId">{{item.term}}</dt>
    <dd ng-repeat-with="someId">{{item.definition}}</dd>
</dl>

हमें आवश्यक लचीलेपन की अनुमति दे सकता है।

सिंटैक्स सी का प्रस्तावित कार्यान्वयन, यह पता चला है कि मुझे लगता है कि यह सिंटैक्स है जो इसी तंत्र को अन्य तत्वों और निर्देशों के लिए आसान बनाने की अनुमति देगा

अच्छा काम लुकास! मैंने सिंटैक्स C को लागू करने की कोशिश में शाम बिताई है। यह सही काम करता है, लेकिन सभी ng-repeat s को टिप्पणियों में बदलने के कारण नेस्टिंग समर्थित नहीं है।

अगर मैं ng-repeat-start तलाश में डोम को ट्रांसवर्स नहीं कर सकता, तो मैं मिलान के लिए ng-repeat-end विशेषता की गहराई की गणना करने में सक्षम नहीं हूं। ऐसा लगता है कि आपका दृष्टिकोण इस मुद्दे को हल कर रहा है ...

हम्म्... कुछ गलत लग रहा है। आपकी प्रतिबद्धता में डॉक्स गायब हैं, इसलिए हो सकता है कि मैं सही सिंटैक्स का उपयोग नहीं कर रहा हूं।

इस पर एक नजर डालें:
http://plnkr.co/edit/sVilxKaNrhNM4JrkuQ5r?p=preview

मुझे उम्मीद है कि गैर-नेस्टेड मामले के लिए आउटपुट होगा:

Term: elastic
     Static term
     This definition should be repeated for every term: 'elastic' term
Term: par
     Static term
     This definition should be repeated for every term: 'par' term

और नेस्टेड के लिए:

Term: elastic
     Static term
Subterm: superelastic
     Static subterm
     This should be repeater for every subterm: 'super' subterm from 'elastic' term
Subterm: subelastic
     Static subterm
     This should be repeater for every subterm: 'sub' subterm from 'elastic' term
     This definition should be repeated for every term: 'elastic' term
Term: par
     Static term
Subterm: superpar
     Static subterm
     This should be repeater for every subterm: 'super' subterm from 'par' term
Subterm: subpar
     Static subterm
     This should be repeater for every subterm: 'sub' subterm from 'par' term
     This definition should be repeated for every term: 'par' term

क्या मुझे कुछ याद आ रहा है?

@lrlopez आपके द्वारा डाला गया उदाहरण कोड के नवीनतम संस्करण का उपयोग नहीं कर रहा है। साथ ही, लाइन 23 . पर एक अतिरिक्त </dl>

तुरंत जवाब के लिए धन्यवाद! आप सही कह रहे हैं, लाइन 23 पर एक अतिरिक्त </dl> था। मैंने लाइब्रेरी को भी अपडेट किया है। फिर भी, मैं अभी भी नेस्टेड उदाहरण काम नहीं कर सकता ...

ठीक है, ऐसा लगता है कि बहु-तत्व निर्देशों के साथ एक वास्तविक मुद्दा है जो डीओएम पर समान स्तर पर हैं। इस समस्या के समाधान के साथ पीआर को अपडेट करें

एनजी-रिपीट-इनर या एनजी-रिपीट-नेक्स्ट जैसे फिक्स केवल अनगिनत स्थितियों में से एक को हल करते हैं जहां वास्तविक डोम नोड्स के लिए बाध्यकारी व्यवहार आपको सीमित कर देगा।

प्रत्येक निर्देश को व्यक्तिगत रूप से पैच करने के बजाय आप वर्चुअल नोड्स के लिए समर्थन जोड़कर इसे पूरे ढांचे के लिए हल कर सकते हैं जो वास्तविक पेड़ में प्रस्तुत नहीं करते हैं।

टिप्पणियों का उपयोग करने का विचार समान है, लेकिन इसका परिणाम भद्दा, कोड को पढ़ने में कठिन होता है और आपको अभी भी उस नोड को नाम देने और इसे किसी तरह बंद करने का एक तरीका चाहिए। एक नई टिप्पणी नोड सिंटैक्स का आविष्कार करने के बजाय, मौजूदा HTML सिंटैक्स का उपयोग करें।

इसके बारे में एक अवधारणा के रूप में सोचें, कहें, एसएएसएस मूक कक्षाएं:

<div id="myComplexList">
    <ng-virtual ng-repeat="...">
        <a></a>
        <b></b>
        <c></c>
    </ng-virtual>
</div>

Result:

<div id="myComplexList">
    <a></a>
    <b></b>
    <c></c>
    <a></a>
    <b></b>
    <c></c>
    <a></a>
    <b></b>
    <c></c>
    ...
</div>

सामान्य विचार के लिए +1 लेकिन मैं एनजी-रिपीट-ग्रुप जैसे कुछ के लिए जाऊंगा।

<ng-repeat-group="b in ches">
// group markup to be repeated here
</ng-repeat-group>

मुझे वर्चुअल नोड्स का विचार पसंद है, लेकिन मैं इसके खिलाफ यहां समस्या के लिए एक सामान्य समाधान बन रहा हूं।

यदि संभव हो तो, मैं किसी भी कृत्रिम कंटेनर के निर्माण को सीमित करना चाहूंगा। हालांकि कंटेनर समग्र परिणाम के एचटीएमएल पर दिखाई नहीं दे सकता है, यह एचटीएमएल कोड को अव्यवस्थित करना शुरू कर देगा जिसे प्रबंधित करने की आवश्यकता है।

कई मामलों में, जो हम दोहराना चाहते हैं उसे शामिल करने के लिए हमें कुछ कंटेनर की आवश्यकता होगी। भूतपूर्व:

<tr>
  <td ng-repeat-start>1</td>
  <td ng-repeat-end>2</td>
</tr>

(कंटेनर यहाँ [tr] s है)

प्रस्तावित वर्चुअल नोड समाधान का उपयोग करके इसे इसमें बदल दिया जाएगा:

<tr>
  <ng-virtual ng-repeat="...">
     <td>1</td>
     <td>2</td>
  </ng-virtual>
</tr>

एक निरर्थक कंटेनर बनाना: यहां तक ​​​​कि यह दो लाइन जोड़ मुझे यह सोचकर असहज महसूस कराता है कि अगर कोड लंबा हो जाता है तो यह कैसा होगा।

एक और मुद्दा यह है कि यह समझने की कोशिश करना कठिन हो जाएगा कि कोड वर्तमान में किस स्तर के डोम में है।
यहाँ @es128 . से कुछ कोड

<table>
<thead>...</thead>
    <tr ng-repeat-start="(name, definition) in myList">...</tr>
    <tr>...</tr>
    <tr ng-repeat-end>...</tr>
    <tr>...</tr>
    <tfoot>...</tfoot>
</table>

वर्चुअल नोड्स का उपयोग करके इसे बदल दिया जाता है:

<table>
<thead>...</thead>
    <ng-virtual ng-repeat="...">
        <tr">...</tr>
        <tr>...</tr>
        <tr>...</tr>
    </ng-virtual>
    <tr>...</tr>
    <tfoot>...</tfoot>
</table>

पहले 3 trs और अंतिम tr की पुनरावृत्ति एक ही स्तर पर है, लेकिन अगर मैं कोड के माध्यम से एक त्वरित स्किम लेना चाहता हूं, तो एक मौका है कि मैं उन्हें विभिन्न स्तरों के रूप में गलती करूंगा, या मैं खुद को ढूंढना शुरू कर दूंगा कठिन गणना (शायद गलत तरीके से) कोड किस स्तर पर काम कर रहा है, खासकर अगर ये चीजें घोंसला बनाना शुरू कर दें।

यहां सिंटैक्स का एक विशेष संस्करण है जो मुझे पसंद है (तरह का बी):

<ul>
  <li>some static prefix item</li>
  <li ng-repeat-block="(name, definition) in myList">{{ something }}</li>
  <li>{{ something else }}</li>
  <li ng-repeat-block-close>{{ something else }}</li>
  <li>some static postfix item</li>
</ul>

@stanvass आपका प्रस्ताव सिंटैक्स X के रूप में @IgorMinar द्वारा पोस्ट की गई भिन्नता है, मुख्य मुद्दा यह है कि ब्राउज़र समर्थन बस नहीं है

मुझे अभी एहसास हुआ है कि ng-repeat-start और ng-repeat-end का होना उस स्थिति में बेमानी है जब आप केवल एक आंतरिक तत्व को दोहराना चाहते हैं।

<tr>
  <td ng-repeat-start ng-repeat-end>repeat this</td>
</tr>

यह अच्छा होगा यदि हमारे पास ng-repeat-single जो इसे रोक सके। भूतपूर्व।

<tr>
  <td ng-repeat-single>repeat this</td>
</tr>

@ daegon123 यदि आप किसी एक तत्व को दोहराना चाहते हैं, तो बस करें

<tr>
  <td ng-repeat="...">repeat this</td>
</tr>

ng-repeat-start की कोई आवश्यकता नहीं है और न ही एनजी- repeat-end

@lgalfaso धन्यवाद, ऐसा लगता है कि मैं प्रस्तावित वाक्यविन्यास में इतना फंस गया हूं कि मैं भूल गया कि हमारे पास पहले से क्या था। आशा है कि हमें जल्द ही एनजी-रिपीट-स्टार्ट/एंड का एहसास होगा।

मुझे लगता है कि यह मुद्दा केवल एक तत्व को दोहराने के बारे में नहीं है। इसके माता-पिता को दोहराए बिना तत्वों के एक सेट को दोहराने के तरीके के बारे में और अधिक। यानी <dt>..<dd>... - लेकिन यहां कई अन्य अच्छे उदाहरण थे।

एक बार जब आप नेस्टिंग रिपीट शुरू कर देते हैं तो सिंटैक्स एक्स एकमात्र ऐसा होता है जिसे अच्छी तरह से परिभाषित किया जाता है। आप सिंटैक्स AD में निम्नलिखित को कैसे लिखेंगे:

<template>
  <dl>
    <ng repeat="book in myList">
      <dt ng-repeat="author in book.authors">{{author.name}}</dt>
      <dd>{{book.title}}</dd>
      <dd>{{book.description}}</dd>
    </ng>
  </dl>
</template>

यह बेहतर सुझाव है।
माई ब्लैकबेरी® . से भेजा गया

-----वास्तविक सन्देश-----
से: daegon123 सूचनाएं @github.com
दिनांक: सोम, 06 मई 2013 22:57:16
प्रति: angular/angular.jsangular। [email protected]
उत्तर-टू: "angular/angular.js" [email protected]
विषय: पुन: [angular.js] ngRepeat with DL / DD / DT (#1891)

मुझे अभी एहसास हुआ है कि ng-repeat-start और ng-repeat-end का होना उस स्थिति में बेमानी है जब आप केवल एक आंतरिक तत्व को दोहराना चाहते हैं।

<tr>
  <td ng-repeat-start ng-repeat-end>repeat this</td>
</tr>

यह अच्छा होगा यदि हमारे पास ng-repeat-single जो इसे रोक सके। भूतपूर्व।

<tr>
  <td ng-repeat-single>repeat this</td>
</tr>

इस ईमेल का सीधे उत्तर दें या इसे GitHub पर देखें:
https://github.com/angular/angular.js/issues/1891#issuecomment -17524685

+1, यह एक बड़ी सीमा है।

:+1: इसके लिए समाधान देखने के लिए तत्पर हैं! मैं अभी के लिए <li> का उपयोग करने जा रहा हूं, लेकिन उस मार्कअप को दोबारा करना अच्छा लगेगा जब कोणीय इसके लिए समाधान के साथ बाहर आता है =)

क्या #2783 इसका समाधान करेगा?

हां। हमारे पास एक समाधान है जो अभी उतरा है: e46100f7097d9a8f174bdb9e15d4c6098395c3f2

मैं इस मुद्दे को बंद कर रहा हूं।

मुझे त्रुटि मिली: <TypeError: Object #<Text> has no method 'hasAttribute'> इस सरल उदाहरण में:

<table>
        <tr ng-repeat-start="value in [1,2,3,4]">I get repeated</tr>
        <tr ng-repeat-end>I also get repeated</tr>
    </table>

साथ ही इस मुद्दे को गेवगेनी राज्यों के रूप में प्राप्त करना।
कोई विधि नहीं है 'hasAttribute'>

<tr>
                <td data-ng-repeat-start="column in selectedItem.Beds" class="text-center">Avail. Beds</td>
                <td data-ng-repeat-end>Extra Bed Spaces</td>
</tr>

@ kharnt0x इस अनुरोध को देखें https://github.com/angular/angular.js/pull/2859

#2783 इसका समाधान कैसे करेगा:

{[{h: "1",
   o: [{h: "1.1",
        o: [{h: "1.1.1"},
            {h: "1.1.2"},
            {h: "1.1.3"}]},
       {h: "1.2",
        o: [{h: "1.2.1"},
            {h: "1.2.2"},
            {h: "1.2.3"}]},

....

इसे कुछ इस तरह से आउटपुट करने की आवश्यकता है:

<h1>1</h1>
<h2>1.1</h2>
<h3>1.1.1</h3>
<h3>1.1.2</h3>
<h3>1.1.3</h3>
<h2>1.2</h2>
<h3>1.2.1</h3>
<h3>1.2.2</h3>
<h3>1.2.3</h3> 

यह वाक्यविन्यास क्या होगा?

@ChrisCinelli hgroup उपयोग करने का प्रयास करें

<h1>1</h1>
<hgroup>
    <h2>1.1</h2>
        <hgroup>
            <h3>1.1.1</h3>
            <h3>1.1.2</h3>
            <h3>1.1.3</h3>
        <hgroup>
    <h2>1.2</h2>
        <hgroup>
            <h3>1.1.1</h3>
            <h3>1.1.2</h3>
            <h3>1.1.3</h3>
        <hgroup>
<hgroup>

तो ऐसा लगता है कि एचग्रुप एचटीएमएल 5 ( http://html5doctor.com/the-hgroup-element/ ) से हटा दिया गया है, इसके अलावा, जैसा कि मैं कह रहा था कि समस्या अधिक जटिल है और हेडर टैग केवल उदाहरण के लिए उपयोग किए गए थे।
यह स्पष्ट रूप से एक उपयोग का मामला है जिसे अनुमति दी जानी चाहिए और कोणीय के सभी घोषणात्मक दृष्टिकोण दर्शन को तोड़ना नहीं चाहिए ...

आप जिस विशिष्ट आउटपुट की तलाश कर रहे हैं, उसके लिए क्या आपने CSS पर विचार किया है?
काउंटर?

देखो:
https://developer.mozilla.org/en-US/docs/Web/Guide/CSS/Counters
http://css-tricks.com/almanac/properties/c/counter-increment/

मंगलवार, 18 जून, 2013 को दोपहर 2:46 बजे क्रिस सिनेली नोटिफिकेशन @github.com ने लिखा:

तो hgroup लगता है HTML5 से हटा दिया गया है (
http://html5doctor.com/the-hgroup-element/ ), उसके बगल में, जैसा कि मैं था
यह कहना कि समस्या अधिक जटिल है और हेडर टैग का उपयोग केवल . के लिए किया गया था
उदाहरण।
यह स्पष्ट रूप से एक उपयोग का मामला है जिसे अनुमति दी जानी चाहिए और यह टूटता नहीं है
कोणीय के सभी घोषणात्मक दृष्टिकोण दर्शन ...

-
इस ईमेल का सीधे उत्तर दें या इसे Gi tHub पर देखेंhttps://github.com/angular/angular.js/issues/1891#issuecomment -19644594
.

मैंने इसे स्पष्ट करने के लिए एक उदाहरण के रूप में शीर्षलेख का उपयोग किया ... वास्तव में मेरे पास डेटा संरचना में प्रत्येक स्तर के लिए अलग संरचना के साथ अपेक्षाकृत जटिल <div> ।

एकमात्र समाधान जो मुझे अब तक मिला है वह है जावास्क्रिप्ट में डेटा संरचना को रैखिक बनाना और विभिन्न स्तरों के लिए एनजी-स्विच का उपयोग करना और इसके लिए मुझे एक अतिरिक्त डिव स्तर की आवश्यकता होगी।
इस समाधान में ओवरहेड (यानी डेटा संरचना को रैखिक करने के लिए मेमोरी और सीपीयू) है और एचटीएमएल अंडरस्कोर टेम्पलेट की तुलना में बहुत कम स्पष्ट दिखने वाला है जिसका मैं इसके बजाय उपयोग कर सकता हूं ...

क्या आप प्रत्येक स्तर के लिए निर्देश बना सकते हैं? मुझे यकीन नहीं है कि किस तरह का
आप यहाँ जिस संरचना के बारे में बात कर रहे हैं, तो मैं सिर्फ तिनके को पकड़ रहा हूँ।
लेकिन मेरे अनुभव में, एनजी-स्विच शायद ही कभी आवश्यक हो जब आपके पास हो
निर्देशों तक पहुंच और एनजी-शामिल, और स्पेगेटी-कोड टेम्पलेट्स की ओर जाता है।

मंगलवार, जून १८, २०१३ को शाम ४:२७ बजे, क्रिस सिनेली ने नोटिफ़िकेशन @github.com लिखा:

मैंने इसे स्पष्ट करने के लिए एक उदाहरण के रूप में शीर्षलेख का उपयोग किया ... वास्तव में मेरे पास है
प्रत्येक स्तर के लिए अलग संरचना के साथ अपेक्षाकृत जटिल div
डेटा संरचना।

एकमात्र समाधान जो मुझे अब तक मिला है, वह होगा पेड़ को रैखिक बनाना
जावास्क्रिप्ट और विभिन्न स्तरों के लिए एनजी-स्विच का उपयोग करें।
इस समाधान में ओवरहेड है (यानी मेमोरी और सीपीयू डेटा को रैखिक करने के लिए
संरचना) और HTML की तुलना में बहुत कम स्पष्ट दिखने वाला है
अंडरस्कोर टेम्प्लेट जिसका उपयोग मैं इसके बजाय कर सकता हूं ...

-
इस ईमेल का सीधे उत्तर दें या इसे Gi tHub पर देखेंhttps://github.com/angular/angular.js/issues/1891#issuecomment -19650391
.

यह इस तरह दिखता है: http://d.pr/i/GSX4
बहुत कम लेबल (1.xx x), विवरण, चेकमार्क की संख्या आदि, डीबी से आते हैं।
मैं इस हिस्से को एंगुलर में बदलने का विकल्प तलाश रहा हूं लेकिन अभी तक कोई पासा नहीं है।

वर्तमान दृश्य बहुत तर्कहीन है और यह अपेक्षाकृत स्पष्ट करता है कि क्या हो रहा है।
अगर मैं अच्छी तरह से समझता हूं, तो आप जावास्क्रिप्ट के एक टुकड़े में हर स्तर को तोड़ने का सुझाव दे रहे हैं।

यह मेरे लिए गड़बड़, कम समेकित और कम पठनीय दिखता है। डेटा संरचना को देखते हुए जिसमें इस पैनल को प्रदर्शित करने के लिए सभी जानकारी है, मुझे एक अलग फ़ाइल (मॉड्यूल/नियंत्रक) में कोड का उपयोग करने की आवश्यकता क्यों है जब तर्क पूरी तरह से संबंधित है और इस दृश्य के बहुत विशिष्ट है? IMHO, नियंत्रक होना चाहिए (और यह अभी वर्तमान कार्यान्वयन में है):

• मॉडल से डेटा प्राप्त करें
• मॉडल को देखने के लिए पास करें ताकि ढांचा इसे प्रस्तुत कर सके

निश्चित रूप से मैं कुछ अतिरिक्त डिव जोड़ सकता हूं और सीएसएस को बदल सकता हूं, लेकिन अगर इसे एंगुलर के साथ काम करने के लिए आवश्यक है, तो ऐसा लगता है कि एंगुलर इस तरह से है कि यहां काम करना कितना सुविधाजनक और सुरुचिपूर्ण है।

मुझे नॉकआउटजेएस में डाटाबेसिंग मिलती है, जो दोनों बाइंडिंग को एचटीएमएल तत्व <div data-bind="foreach: ..."> साथ-साथ "कंटेनरलेस कंट्रोल फ्लो सिंटैक्स", <!-- ko foreach: ... --><!-- /ko --> असाधारण रूप से उपयोगी होने के लिए अनुमति देता है, और सोचता है कि यह बहुत अच्छा होगा यदि कोणीय सिंटैक्स विकल्पों के एक समान सेट का समर्थन कर सकता है, बहुत हद तक सिंटैक्स @bowsersenior द्वारा सुझाए गए।

नॉकआउट के "कंटेनरलेस" विकल्प के बारे में अधिक जानकारी के लिए:
http://knockoutjs.com/documentation/foreach-binding.html

@mg1075 वर्चुअल सिंटैक्स के लिए +1।
नॉकआउटजेएस डीडी और नेस्टेड संग्रह से निपटना आसान बनाता है।
उदाहरण के लिए http://stackoverflow.com/questions/20062032/nested-table-using-ng-repeat