0

その2日目はangularJSの学習を開始しました。知りました

  1. アプリケーションでは、ng-app はすべて同じであるか、アプリケーションの定義です。

  2. ng-app は複数の ng-controller を持つことができます。

  3. コントローラー名に基づいて、コントロールをその実装に移動できます。
  4. アプリケーションには複数の div タグがあり、すべての div が異なるコントローラーを持つ場合があります。

上記の理解から、テストするサンプルコードを以下に記述しました。

<!DOCTYPE html>
<html>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<body  ng-app="expressions" >

<div ng-controller="NGExpressionController">

<h1>This is AngularJS Expression example.......</h1>

<p>On String expression...</p>
Name: <input ng-model="name" type="text"></input></br>
Your name is {{name}}

</div>


<div ng-controller="NGExpressionControllerTwo">

<h1>This is AngularJS Expression example.......</h1>

<p>On String expression...</p>
Name: <input ng-model="adddress" type="text"></input></br>
Your name is {{address}}

</div>

<script>

    angular.module('expressions', []).controller('NGExpressionController',function($scope){
        $scope.name="Test Name";
    });


</script>

<script>

    angular.module('expressions', []).controller('NGExpressionControllerTwo',function($scope){
    $scope.address="Kolkata";   
    });
</script>

</body>
</html>

しかし、上記のコードはエラーの下に表示されています:

https://docs.angularjs.org/error/ng/areq?p0=NGExpressionController&p1=not%20a%20function,%20got%20undefined

どこが間違っているのですか？私の理解が間違っているのか、それともコードの実装が間違っているのか..どんな形式のヘルプでも大いに役立ちます。

4

2 に答える 2

0

まず、モジュールの定義が間違っているため、コードにいくつかのエラーがあります。

    <script>
     angular.module('expressions',[])
      .controller('NGExpressionController',function($scope){
          $scope.name="Test Name";
      })
      .controller('NGExpressionControllerTwo',function($scope){
          $scope.address="Kolkata";   
      });
   </script>

アプリを作成するときは、モジュールを一度定義する必要があり、モジュールを定義した後、モジュールの使用を作成するために、モジュールオブジェクトを正しく呼び出してそのモジュールを使用します

   angular.module('yourModuleName',[])

そのモジュールを再び使用するには

 angular.module('yourModuleName')

[ ] は必要ありません。正方形のバーケットは、そのモジュールの依存関係を定義するために使用されます。これを配置すると、モジュールが再度初期化され、以前に定義されたモジュール プロパティが失われます。

1 : ng-app ディレクティブは angular アプリを初期化し、アプリ全体で使用できるようになります。とにかく、1 つのアプリケーションリンクで複数の角度のあるアプリを手動で作成 (ブートストラップ) できます

2 : ng-app は複数のコントローラーを持つことができます。コントローラーを作成し、必要に応じて任意の dom 要素にバインドできます。

   <div ng-controller="NGExpressionController">
   {{name}}
     <div ng-controller="NGExpressionControllerTwo">
     {{address}}
     </div>
   </div>

3 : 定義されたコントローラーに基づいて、対応する dom 要素のロジックまたは関数を操作できます

4 : もちろん yes です。コントローラをネストして $scope 継承を利用することもできます。、それらを賢く使用してください...幸せなコーディング...

于 2016-04-20T12:27:41.543 に答える