2016-04-12 26 views
0

Çocuklardan tablo sırası bileşenleri oluşturmak istediğim bir tablo bileşenim var.Tablo bileşenindeki açısal tablo satırı bileşeni

module.component('documents', documentsComponent); 

var documentController = function() { 
}; 

var documentComponent = { 
    template: 
      ' <td>fl ={{vm.document}}</td>' + 
      ' <td>{{document.Name}}</td>', 
    controller: documentController, 
    replace: true, 
    controllerAs: 'vm', 
    bindings: { 
     document: '<' 
    } 
}; 

module.component('document', documentComponent); 

sorun işaretlemenin doğru olmadığıdır:

var documentsController = function() {}; 

var documentsComponent = { 
    template: '<div class="col-lg-12 col-md-12 tableDataContainer">' + 
      ' <table class="table">' + 
      ' <thead>' + 
      '  <tr>' + 
      '  <td>Name</td>' + 
      '  <td>Document Type</td>' + 
      '  </tr>' + 
      ' </thead>' + 
      ' <tr ng-repeat="document in vm.documents">' + 
      '  <document document="document"></document>' + 
      ' </tr>' + 
      ' </table>' + 
      '</div>', 
    controller: documentsController, 
    controllerAs: 'vm', 
    bindings: { 
     documents: '<' 
    } 
}; 

İşte benim Tablo satır bileşenidir. Belge masanın dışında:

<div class="col-lg-12 col-md-12 tableDataContainer"> 
    <document document="document" class="ng-isolate-scope"> 
     <tr> 
      <td class="ng-binding">fl =</td> 
      <td class="ng-binding"></td> 
     </tr> 
     </document> 
    <table class="table"> 
     <thead> 
      <tr> 
       <td>Name</td> 
       <td>Document Type</td>  
      </tr> 
     </thead> 
     <tbody><!-- ngRepeat: document in vm.documents --> 
     <tr ng-repeat="document in vm.documents" class="ng-scope"> 
     </tr> 
     <!-- end ngRepeat: document in vm.documents --> 
     </tbody> 
     </table> 
     </div> 

Ayrıca belge satır bileşeni geçirilen almıyor ve nedenini bilmiyorum.

cevap

2

Geç cevaplar, ama umarım hala birine yardım eder. td ya da tr etiketinin içinde td ya da th hiçbir şey "çok" geçersiz html olduğundan ve tarayıcınız onu atar.

deneyin bu (veya açısal sonucu engel olabilir şey): Eğer satır eklemek olarak

<table> 
 
<tbody> 
 

 
    <tr> 
 
    <td>td in row 1</td> 
 
    <div>div in row 1</div> 
 
    </tr> 
 

 
    <tr> 
 
    <td>td in row 2</td> 
 
    <div>div in row 2</div> 
 
    </tr> 
 

 
</tbody> 
 
</table>

td tablonun içinde görünecektir, ancak div taşınacak dışında (krom, daha önce) tarayıcınız tarafından masa. Açısaldan önce bile html'yi ayrıştırma şansı vardır.

bir çözüm olarak, restrict: 'A' ile bir yönerge kullanabilirsiniz ve bu gibi bir şablon:

<tr ng-repeat="document in vm.documents" document="document"> 
</tr> 
İlgili konular