2016-04-09 8 views
1

:Angular2: html etiketleri Ayrıştırma veri Ben açısal 2 ve Ben özellikle düğmeleri, Bence bir hizmet veri yüklenmesi ediyorum kullanıyorum

benim Görünüm:

<div id="menuMaisons" class="collapse" *ngFor="#item of items_list"> 
    <li> 
     <div > 
     <a href="{{item.href}}" class="{{item.class}}" data-toggle={{'item.toggle'}} data-parent={{'item.parent'}} > 
      <span class="titres"> {{item.label}}</span> 
     </a> 
     </div> 
    </li> 
</div> 

[ 

    { "//////////////////SUBMENU MAISON////////////////":""}, 

    { "id": 1, "href": "#maisonsTemoins" ,"class": "list-group-item", "toggle": "collapse" ,"parent":"#menuMaisons" ,"label":"Maisons Tèmoins" }, 


    { "id": 2, "href": "" ,"class": "list-group-item", "toggle": " " ,"parent":" " ,"label":"Charger Photo" } 


] 
:

benim hizmet bu json veri parsin basitçe 210

ayrıştırma başarısız olur ve ne tür bir hata olduğunu anlamadım; hatası:

EXCEPTION: Error: Uncaught (in promise): Template parse errors: Unexpected closing tag "a" ("      
<span class="titres"> {{item.label}}</span> 
            [ERROR ->]</a> 
           </div> 
          </li> 
+0

değişim 'veri geçiş = {{ 'item.toggle'}} veri ebeveyn = {{ 'item.parent'}}' tırnak dışına '{{...} } "data-toggle =" {{item.toggle}} 'data-parent =' {{item.parent}} '' – Abdulrahman

cevap

2
<li> 
     <div > 
     <a [attr.href]="item.href" 
      [ngClass]="item.class" 
      [attr.data-toggle]="item.toggle" 
      [attr.data-parent]="item.parent" > 
      <span class="titres"> {{item.label}}</span> 
     </a> 
     </div> 
</li> 
+0

evet çok işe yarayan çok teşekkürler – firasKoubaa

+0

Hoşgeldin @firasKoubaa – micronyks

2

soruya doğru cevap ve kabul edilen ama cevap çok Burada dikkat çekilmesi gereken sorgulayıcı birkaç puan için açıklama ile açıklık olmadığı hissetmek rağmen -

  • Sorunun yanıtı, açısal enterpolasyonlu sözdizimi arasında {{'item.toggle'}} tırnak işareti kullanamazsınız, herhangi bir hata atmaz, ancak açısal bunu bir dize olarak kabul eder ve yeniden interpolasyon ifadesinde ({{ }}) sağladığınız dize olarak geri döndürün. örneğin -

Merhaba {{adı}} {{ 'adı}}

this.name = "pardeep Jain";

Sonucu olduğunu - Merhaba pardeep Jain adı

  • o angular2 tarafından verilen bağlanma Öznitelik kullanmak daha iyidir önceden tanımlanmış öğelere dinamik veriler sağlarken. Varsayılan olarak açısal özellik, özellik ciltleme özelliğini kullanır. Açısal'ya, öznitelik bağlayıcısını kullanmaya açıkça izin vermek için, bunun yerine aşağıdakileri kullanırız: - [attr.property_name]. örneğin cevaplayan

    [attr.href] öyle elevis operator kullanmak daha iyi HTML elemanına bağlanma özelliğinin zamanda vb

  • [attr.data-geçiş] herhangi bir hatayı atmak ve bir yerde bağlayıcı bir şey yaptıktan sonra herhangi bir nedenden dolayı veri düzgün bir şekilde alamazsınız böylece açısal hata bu elvis operatörü kullanmak için daha iyi bir hata atacaktır yardımcı olduğunda uygulamayı durdurmak için izin vermeyin.

    {{item.abc}} - - örneğin madde

    bulunmazsa eğer atış hatası {{madde .abc?}} - hatayı önler.

+0

Mükemmel, evet en net, çok teşekkürler – firasKoubaa

+0

Hoşgeldin @firasKoubaa –

İlgili konular