Angular2/Nativescript：當嵌套StackLayouts時出現奇怪的「意外標記」錯誤

我忙於一個Angular2 Nativescript應用程序，它在將輸入字段移動到另一個視圖的部分之前工作得很好，但出現以下錯誤，出現意外的結束標記「StackLayout」...任何想法可能導致這種情況？堆棧佈局的數量是否可以互相嵌套？我搬到觀點的不同部分的輸入域的數量輸入字段...Angular2/Nativescript：當嵌套StackLayouts時出現奇怪的「意外標記」錯誤

的錯誤，我得到：

JS: ns-renderer: ERROR BOOTSTRAPPING ANGULAR 
JS: ns-renderer: Template parse errors: 
JS: Unexpected closing tag "StackLayout" ("Field class="input input-border" hint="Enter Quantity" keyboardType="number" [(ngModel)]="qty"> 
JS:        [ERROR ->]</StackLayout> 
JS:        <Button class="btn btn-primary pull-right font-awesome" text="&#xf058; Capture" ("): [email protected]:4 
JS: Unexpected closing tag "StackLayout" ("me" text="&#xf058; Capture" (tap)="capture()" [isEnabled]="qty !== '' && qty != null"></Button> 
JS:      [ERROR ->]</StackLayout> 
JS:    </StackLayout> 
JS: 
JS: "): [email protected]:3 
JS: Unexpected closing tag "StackLayout" ("; Capture" (tap)="capture()" [isEnabled]="qty !== '' && qty != null"></Button> 
JS:      </StackLayout> 
JS:    [ERROR ->]</StackLayout> 
JS: 
JS:    <StackLayout *ngFor="let item of stockTakeDetailList" *ngIf="stockTakeDetailList.l"): [email protected]:2 
JS: Unexpected closing tag "StackLayout" ("nt-awesome" text="&#xf1f8; remove" (tap)="removeCaptureItem(item.IDKey)"></Button> 
JS:  </StackLayout> 
JS:  [ERROR ->]</StackLayout> 
JS: </StackLayout>"): [email protected]:1 
JS: Unexpected closing tag "StackLayout" (" 
JS:  </StackLayout> 
JS:  </StackLayout> 
JS: [ERROR ->]</StackLayout>"): [email protected]:0 
JS: 
JS: Error: Template parse errors: 
JS: Unexpected closing tag "StackLayout" ("Field class="input input-border" hint="Enter Quantity" keyboardType="number" [(ngModel)]="qty"> 
JS:        [ERROR ->]</StackLayout> 
JS:        <Button class="btn btn-primary pull-right font-awesome" text="&#xf058; Capture" ("): [email protected]:4 
JS: Unexpected closing tag "StackLayout" ("me" text="&#xf058; Capture" (tap)="capture()" [isEnabled]="qty !== '' && qty != null"></Button> 
JS:      [ERROR ->]</StackLayout> 
JS:    </StackLayout> 
JS: 
JS: "): [email protected]:3 
JS: Unexpected closing tag "StackLayout" ("; Capture" (tap)="capture()" [isEnabled]="qty !== '' && qty != null"></Button> 
JS:      </StackLayout> 
JS:    [ERROR ->]</StackLayout> 
JS: 
JS:    <StackLayout *ngFor="let item of stockTakeDetailList" *ngIf="stockTakeDetailList.l"): [email protected]:2 
JS: Unexpected closing tag "StackLayout" ("nt-awesome" text="&#xf1f8; remove" (tap)="removeCaptureItem(item.IDKey)"></Button> 
JS:  </StackLayout> 
JS:  [ERROR ->]</StackLayout> 
JS: </StackLayout>"): [email protected]:1 
JS: Unexpected closing tag "StackLayout" (" 
JS:  </StackLayout> 
JS:  </StackLayout> 
JS: [ERROR ->]</StackLayout>"): [email protected]:0 
JS:  at DirectiveNormalizer.normalizeLoadedTemplate (/data/data/org.nativescript.barcodescanner/files/app/tns_modules/@angular/compiler/bundles/compiler.umd.js:13337:21) 
JS:  at /data/data/org.nativescript.barcodescanner/files/app/tns_modules/@angular/compiler/bundles/compiler.umd.js:13324:53 
JS:  at ZoneDelegate.invoke (/data/data/org.nativescript.barcodescanner/files/app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js:190:28) 
JS:  at Zone.run (/data/data/org.nativescript.barcodescanner/files/app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js:83:43) 
JS:  at /data/data/org.nativescript.barcodescanner/files/app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js:449:57 
JS:  at ZoneDelegate.invokeTask (/data/data/org.nativescript.barcodescanner/files/app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js:223:37) 
JS:  at Zone.runTask (/data/data/org.nativescript.barcodescanner/files/app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js:123:47) 
JS:  at drainMicroTaskQueue (/data/data/org.nativescript.barcodescanner/files/app/tns_modules/nativescript-angular/zone-js/dist/zone-nativescript.js:355:35) 
1:54:21 PM - Compilation complete. Watching for file changes.

而且這裏是我的組件的HTML代碼：

<StackLayout class="page"> 
    <ActionBar title="Stock Take" android.icon="res://icon" android.iconVisibility="always"></ActionBar> 
    <StackLayout *ngIf="!stockTaking"> 
     <Label class="h1 title m-x-auto" text="Begin Stock Take?"></Label> 
     <StackLayout class="form"> 
      <StackLayout class="input-field">    
       <ListView [items]="activeStockTakes" class="list-group" (itemTap)="selectActiveStockTake($event.target.value)"> 
       <template let-activeStockTake="item"> 
       <StackLayout> 
        <Label class="list-group-item" [text]="activeStockTake.UserCode + ' - ' + activeStockTake.Comment"></Label> 
       </StackLayout> 
       </template> 
       </ListView> 
       <TextField class="input input-border tf" hint="Enter Sheet Number" placeholderColor="white" [(ngModel)]="sheetNo"></TextField> 
       <TextField class="input input-border" hint="Enter Bin Number" [(ngModel)]="binNo"></TextField>   
      </StackLayout> 
      <Button class="btn btn-primary font-awesome" text="&#xf04b; Start Stock Take" (tap)="startStockTake()" [isEnabled]="sheetNo !== '' && sheetNo != null && binNo !== '' && binNo != null"></Button> 
     </StackLayout> 
    </StackLayout> 
    <StackLayout *ngIf="stockTaking"> 
     <StackLayout class="form"> 
      <Button id="endStockTakeBtn" class="btn pull-right font-awesome" text="&#xf00d; End Stock Take" (tap)="endStockTake()"></Button> 
      <StackLayout class="input-field">  
       <TextField class="input input-border" hint="Enter Barcode" keyboardType="number" [(ngModel)]="barcode"></TextField>  
      </StackLayout> 

      <Button class="btn btn-primary pull-right" text="Scan" (tap)="scan()" [isEnabled]="barcode !== '' && barcode != null"></Button> 

     </StackLayout> 
     <StackLayout *ngIf="product" class="m-x-auto"> 
      <Label class="label text-primary" [text]="'Description: ' + product.Description"></Label> 
      <Label class="label text-primary" [text]="'POS Description: ' + product.POSDescription"></Label> 
      <Label class="label text-primary" [text]="'POS price: R' + product.POSPrice"></Label> 
      <Label class="label text-primary" [text]="'Stock On Hand: ' + product.StockOnHand"></Label> 
      <StackLayout class="form"> 
       <StackLayout class="input-field"> 
        <TextField class="input input-border" hint="Enter Quantity" keyboardType="number" [(ngModel)]="qty"> 
       </StackLayout>    
       <Button class="btn btn-primary pull-right font-awesome" text="&#xf058; Capture" (tap)="capture()" [isEnabled]="qty !== '' && qty != null"></Button> 
      </StackLayout> 
     </StackLayout> 

     <StackLayout *ngFor="let item of stockTakeDetailList" *ngIf="stockTakeDetailList.length > 0"> 
      <Label [text]="'Name: ' + item.ProductDetail_Name" class="text-primary"></Label>    
      <Label text="'Qty: ' + item.Qty" class="text-primary"></Label>   
      <Button class="btn btn-primary pull-left font-awesome" text="&#xf1f8; remove" (tap)="removeCaptureItem(item.IDKey)"></Button> 
    </StackLayout> 
    </StackLayout> 
</StackLayout>

來源

2017-02-24 user2094257

看起來你有一個或兩個額外的'標籤 – mast3rd3mon

@ mast3rd3mon你在哪裏看到這些額外的stackLayout標籤？ – user2094257

每次它說'[ERROR - >'。如果不是這樣，你錯過了別的東西 – mast3rd3mon

這是你的問題：

<StackLayout class="input-field"> 
     <TextField class="input input-border" hint="Enter Quantity" keyboardType="number" [(ngModel)]="qty"> 
</StackLayout>

你忘了關閉</TextField>下關閉標籤是它被扔在，因爲它不符合收到TextField錯誤的/StackLayout。

來源

2017-02-27 19:50:37 Nathanael

謝謝@Nathanael – user2094257

我得到了同樣的錯誤客棧這下面的行導致使用字體真棒時的錯誤

nt-awesome" text="&#xf1f8;

並嘗試解決它唱：fonticon-nativescript angular

來源

2017-02-25 22:46:14

Angular2/Nativescript：當嵌套StackLayouts時出現奇怪的「意外標記」錯誤

回答

相關問題