Che cos'è un elemento radice in Angular?

Question

ho scritto una direttiva come questa:

app.directive('headersort', function() { 
    return { 
     restrict: 'E', 
     scope: { 
      sortBy: '=', 
      title: '=' 
     }, 
     template: '<th>{{ title }}</th>', 
     replace: true, 
     link: function (scope, element, attributes) { 
      scope.sortBy = attributes.sortBy; 
      scope.title = attributes.title; 

     } 
    }; 
}); 

e lo uso come questo:

<headersort sortBy="Name" title="Product"> 

Quello che voglio è che <headersort sortBy="Name" title="Product"> è sostituito con <th>Product</th>. Ma ottengo un detto errore:

Template must have exactly one root element. was: <th>{{ title }}</th>

Ma ho un elemento principale, giusto? Il mio elemento principale è <th>, quindi perché è angolare lanciare questo errore? Quali sono le condizioni/definizione di un elemento radice?

Answer 1

Date un'occhiata a this problema.

provare a cambiare la vostra direttiva restrict: 'E'-restrict: 'A' e cambiare il codice HTML per <th headersort sortBy="Name" title="Product"></th>

Answer 2

Credo che la sua dicendo circa l'elemento table. L'hai definito da qualche parte?