AngularJSテキストフィールドのラベルの指示

Question

私は角度指示には新しく、私はこのプロジェクトで作業しています。このプロジェクトでは、ほとんどのページでフォームを使用しています。

したがって、次のテキストフィールドを使用してラベルを作成するカスタムディレクティブを作成することは賢明だと思いました。

しかし、私がこれまで達成したことは、実際には機能していないため、どうしてわからないのですか。

特に、私のディレクティブを基本的なフォーマットで動作させることはできますが、ng-modelを実装しようとすると、私のコンソールに角度のエラーが発生します。

マイスクリプト：

<script> 
var app = angular.module("myApp", []) 
    app.directive("labelWithTextfield", function() { 
     return { 
      require: '^ngModel', 
      scope: { 
       ngModel: '=', 
       label: '@', inputName: '@' 
      }, 
      template : "<label for='{{label}}' class='labelClass'>{{label}}  </label><br>"+ 
      "<input type='text' name='{{inputName}}' class='textFieldClass' required ng-model='internship.{{inputName}}' />", 
     }; 
    }); 
</script> 

私のHTMLタグ：それはNG-モデルの一部に到達するまでディレクティブの私の最初のレンダリングは、 "ファイン" になり

<div label-with-textfield label="Navn" inputName="name" ></div> 
<br> 
<div label-with-textfield label="Adresse" inputName="address" ng-model="internships.name"></div> 

、その後、私はこのエラーを取得：私が言ったように

https://docs.angularjs.org/error/$parse/syntax?p0=%7B&p1=is%20not%20a%20valid%20identifier&p2=12&p3=internship.%7B%7BinputName%7D%7D&p4=%7B%7BinputName%7D%7D

は今、私は専門家だが、私は見ているのされてきましたgオンラインで、例を見つけようとしましたが、これまでにできなかったこと - どんな助けでも大いに感謝します！

Answer 1

あなたのhtmlタグは、ケバブ、同棲する必要があります：あなたの問題を解決する必要があり

<div label-with-textfield label="Navn" input-name="name" ></div> 

。