title: Ionic 2 Accordion is not working
body: <p>I'm trying to create Accordion using below code. But I'm getting error.</p>
  
  <p>But If I comment subCategory(below) html code I'm not seeing issue.</p>
  
  <pre><code>&lt;ion-item *ngFor="let subCategory of category.ProductSubCategory" *ngIf="isGroupShown(i)"&gt;
          &lt;a (click)="callProductDetails(subCategory.Product_SubCategory_Id)"&gt;{{subCategory.Description}}&lt;/a&gt;
        &lt;/ion-item&gt;
  </code></pre>
  
  <p>HTML Accordion:</p>
  
  <pre><code>  &lt;ion-list *ngIf="categories.length &gt; 0"&gt;
      &lt;ion-item *ngFor="let category of categories; let i=index" text-wrap (click)="toggleGroup(i)" [ngClass]="{active: isGroupShown(i)}"&gt;
        &lt;h3&gt;{{category.Description}}&lt;/h3&gt;
        &lt;ion-item *ngFor="let subCategory of category.ProductSubCategory" *ngIf="isGroupShown(i)"&gt;
          &lt;a (click)="callProductDetails(subCategory.Product_SubCategory_Id)"&gt;{{subCategory.Description}}&lt;/a&gt;
        &lt;/ion-item&gt;
      &lt;/ion-item&gt;
    &lt;/ion-list&gt;
  </code></pre>
  
  <p>Component:</p>
  
  <pre><code>constructor(public navCtrl: NavController, public loadingCtrl: LoadingController, public service: Service) {
  
      this.loading.present();
      this.service.getCategoryData(this.id).subscribe(
          data =&gt; {
              this.service.getCategories()
                  .then(result =&gt; {
                      this.categories = result;
                      this.loading.dismiss();
                  });
          },
          err =&gt; console.error(err)
      );
  }
  
  
  toggleGroup(group) {
      if (this.isGroupShown(group)) {
          this.shownGroup = null;
      } else {
          this.shownGroup = group;
      }
  };
  isGroupShown(group) {
      return this.shownGroup === group;
  };
  </code></pre>
  
  <p><strong>ERROR:</strong>
   Unhandled Promise rejection: Template parse errors:
  Can't have multiple template bindings on one element. Use only one attribute named 'template' or prefixed with * ("ory.Description}}</p>
  
  <pre><code>      &lt;ion-item *ngFor="let subCategory of category.ProductSubCategory" [ERROR -&gt;]*ngIf="isGroupShown(i)"&gt;
  
          &lt;a (click)="callProductDetails(subCategory.Product_SubCategory_"): ng:///AppModule/HomePage.html@100:76 ; Zone: &lt;root&gt; ; Task: Promise.then ; Value: Error: Template parse errors:
  </code></pre>
  
  <p>Can't have multiple template bindings on one element. Use only one attribute named 'template' or prefixed with * ("ory.Description}}</p>
  
  <pre><code>      &lt;ion-item *ngFor="let subCategory of category.ProductSubCategory" [ERROR -&gt;]*ngIf="isGroupShown(i)"&gt;
  
          &lt;a (click)="callProductDetails(subCategory.Product_SubCategory_"): ng:///AppModule/HomePage.html@100:76
  at syntaxError (compiler.es5.js:1540)
  at TemplateParser.parse (compiler.es5.js:12031)
  at JitCompiler._compileTemplate (compiler.es5.js:25782)
  at compiler.es5.js:25706
  at Set.forEach (&lt;anonymous&gt;)
  at JitCompiler._compileComponents (compiler.es5.js:25706)
  at createResult (compiler.es5.js:25591)
  at t.invoke (polyfills.js:3)
  at r.run (polyfills.js:3)
  at polyfills.js:3 Error: Template parse errors:
  </code></pre>
  
  <p>Can't have multiple template bindings on one element. Use only one attribute named 'template' or prefixed with * ("ory.Description}}</p>
  
  <pre><code>      &lt;ion-item *ngFor="let subCategory of category.ProductSubCategory" [ERROR -&gt;]*ngIf="isGroupShown(i)"&gt;
  
          &lt;a (click)="callProductDetails(subCategory.Product_SubCategory_"): ng:///AppModule/HomePage.html@100:76
  at syntaxError (http://localhost:4400/build/vendor.js:85381:34)
  at TemplateParser.parse (http://localhost:4400/build/vendor.js:95872:19)
  at JitCompiler._compileTemplate (http://localhost:4400/build/vendor.js:109623:39)
  at http://localhost:4400/build/vendor.js:109547:62
  at Set.forEach (&lt;anonymous&gt;)
  at JitCompiler._compileComponents (http://localhost:4400/build/vendor.js:109547:19)
  at createResult (http://localhost:4400/build/vendor.js:109432:19)
  at t.invoke (http://localhost:4400/build/polyfills.js:3:8971)
  at r.run (http://localhost:4400/build/polyfills.js:3:4140)
  at http://localhost:4400/build/polyfills.js:3:13731
  </code></pre>