2

私は角度のアプリケーションで作業しています。特定のディレクティブのために、私はこのようなテンプレート関数を使用します。私は自分のコードを実行したときにエラーを与える指令のAngularJSテンプレート関数 'テンプレートの指令はちょうど1つのルート要素を持たなければならない'

template: function(element, attr) { 
       return '<div class="myClass">/..some HTML here../</div>' 
      } 

はしかし、私は次のエラーを取得する:

Error: Template for directive must have exactly one root element, was function (element, attr) { ...the function definition goes here }

私は通常のキーと値のペアに変更した場合次のように、それは正常に動作します。

template: '<div class="myClass">/..some HTML here../</div>' 

私はここで何が間違っているのか分かりません。リンク関数とコンパイル関数はうまく動作します。これに関する助けは本当に感謝しています。事前に感謝します

+0

あなたはあなたの問題のためにplunkrを投稿することができますか?どの角度バージョンを使用していますか?関数をテンプレートに渡すと、htmlを生成するロジックがありますか> –

+0

@NikhilBhandari htmlを生成するためのロジックを使わずに関数からhtmlを返すだけですが、いくつかの 'attr'を'ng-switch'。私は角度v1.0.4を使用しています –

+0

ディレクティブのテンプレート変数には値が必要です。あなたの関数を渡してください。function.declareを使いたい場合は、 'template:myfunction()'のようにここで呼び出してください。 – saiyan

答えて

1

この機能は、より新しいバージョンの角度1.1.4で導入されました。 @ saiyanが言及したように、あなたはアップグレードするか回避策を見つけなければならないでしょう。

チェックこのplunkr - plnkr.co/edit/QVdE3xdn3hmcoQ33gj2R?p=preview

HTML:

<!DOCTYPE html> 
<html ng-app="myapp"> 

    <head> 

    <!-- CHANGE THE ANGULAR VERSION HERE --> 
    <script src="https://code.angularjs.org/1.0.4/angular.js"></script> 

    <script src="app.js"></script> 
    </head> 

    <body > 
    <div something></div> 
    </body> 

</html> 

JS:

var app = angular.module('myapp', []); 

app 
    .directive("something", function() { 
     return { 
      template: function() { 
       return "Hello World!"; 
      } 
     } 
    }) 
関連する問題