स्थिति के आधार पर टीडी प्रदर्शित करने के लिए तालिका के साथ

Question

एनजी पर पहले की पोस्ट के संदर्भ में यदि डीआईवी के भीतर दिए गए लिंक के संदर्भ में यहां दिए गए लिंक के संदर्भ में :: Ng-If within DIV, हालांकि जब मैंने एनजी के साथ ऐसा करने की कोशिश की टीडी पर एनजी-दोहराने के साथ तालिका के अंदर यह अच्छी तरह से काम नहीं करता है। अगर मैं गलत हूं तो मुझे सही करें मैंने शर्त के आधार पर कॉलम प्रदर्शित करने के लिए 2 कोशिश की लेकिन कोई भी काम नहीं करता है। नीचे मैंने संदर्भ के लिए कोड दिया है। क्या कोई इस पर मेरी मदद कर सकता है। अगर आपको अधिक स्पष्टीकरण की आवश्यकता है तो कृपया बताएं।

एचटीएमएल

प्रयास करें :: 1

<table> 
     <tr ng-repeat = "data in comments"> 
      <td ng-if="data.type == 'hootsslllll' "> 
      //differnt template with hoot data 
      </td> 
      <td ng-if="data.type == 'story' "> 
      //differnt template with story data 
      </td> 
      <td ng-if="data.type == 'article' "> 
      //differnt template with article data 
      </td> 
     </tr> 

    </table> 

प्रयास करें :: 2

<table> 
    <tr ng-repeat = "data in comments"> 
     <div ng-if="data.type == 'hootsslllll' "> 
      <td> //differnt template with hoot data </td> 
     </div> 
     <div ng-if="data.type == 'story' "> 
      <td> //differnt template with story data </td> 
     </div> 
     <div ng-if="data.type == 'article' "> 
      <td> //differnt template with article data </td> 
     </div> 
    </tr> 
</table> 

Answer 1

ng-if लिए काम करना चाहिए अपने कोशिश :: 1। यहाँ बेला काम कर उदाहरण

http://jsfiddle.net/shivaraj/n3xWB/

Answer 2

अधिकांश की यदि ब्राउज़र अच्छी तरह से गठित नहीं होता है तो ब्राउज़र किसी तालिका संरचना के भीतर किसी अन्य DOM तत्वों को अनदेखा कर देगा। जिसका अर्थ है, आपके उपरोक्त कोड में आपके पास div टैग tr के भीतर नहीं हो सकता है। इस प्रयास करें बजाय

<table> 
    <tr ng-repeat = "data in comments"> 
    <td ng-if="data.type == 'hootsslllll' "> //differnt template with hoot data </td> 
    <td ng-if="data.type == 'story' "> //differnt template with story data </td> 
    <td ng-if="data.type == 'article' "> //differnt template with article data </td> 
    </tr> 
</table> 

Answer 3

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

यह <table> और <div> दोनों के लिए उपयुक्त व्यक्तिगत रूप से

<div ng-controller="tableCtrl"> 
     <div ng-repeat="data in comments"> 
      <div ng-if="data.type === 'hootsslllll' ">//differnt template with hoot data</div> 
      <div ng-if="data.type === 'story' ">//differnt template with story data</div> 
      <div ng-if="data.type === 'article' ">//differnt template with article data</div> 
     </div> 
</div> 

http://jsfiddle.net/Mu6T6/3/