34

Angular の新機能。明らかな何かが欠けているように感じます:同じ html ページで AngularJs アプリ (モジュール) を分離するために簡単に実行できるはずではありませんか? このようなもの：

  <section ng-app="HelloWorldApp" ng-controller="HelloWorldController">
    Hello {{name}}!
  </section> 
  <br />
  <section ng-app="MyNameIsApp" ng-controller="MyNameIsController">
    My Name is {{FirstName}} {{LastName}}!
  </section>

Javascript:

var HelloWorldApp = angular.module('HelloWorldApp', []);
HelloWorldApp.controller('HelloWorldController', function($scope) {
  $scope.name = 'World';
});

var MyNameIsApp = angular.module('MyNameIsApp', []);
MyNameIsApp.controller('MyNameIsController', function($scope) {
  $scope.FirstName = 'John';
  $scope.LastName = 'Smith';
});

これは最初のモジュールのみを実行しますが、2 番目のモジュールは何も実行しないようです。モジュールに同じ名前を付ける必要がない、複数のページ用の再利用可能なカプセル化されたディレクティブを作成できるように、これを行いたいと考えています。

実際の例: http://plnkr.co/edit/cE6i3ouKz8SeQeA5h3VJ

モジュールの小さな階層を構築することになりましたが、私の元の質問は少し作業するだけで実行できます（以下を参照）。

4

3 に答える 3

49

可能ですが、手作業で少しコーディングする必要があります。自分でAngularアプリをブートストラップする必要があります. それほど複雑ではありませんのでご安心ください

  • ng-appHTML に属性を追加しないでください
  • アプリを保持しているDOM要素を取得できることを確認してください
  • DOM が読み込まれたら、自分でアプリを起動する必要があります。angular.bootstrap( domElement, ['AppName']);

動作するプランカーのフォーク: http://plnkr.co/edit/c5zWOMoah2jHYhR5Cktp

于 2013-05-03T01:29:57.733 に答える
7

ngAppの Angularドキュメントによると:

このディレクティブを使用して、アプリケーションを自動ブートストラップします。HTML ドキュメントごとに使用できるディレクティブは 1 つだけです。ディレクティブはアプリケーションのルートを指定し、通常はページのルートに配置されます。

仕様のようです。

于 2013-05-02T16:30:00.613 に答える
5

メインのアプリのモジュール定義で、ネストされたアプリを指定できます。

angular.module("myapp", ['statusapp', 'tickerapp']).controller(....

別のファイルには、他のアプリが定義されています。この一部を隠すテンプレート エンジンを使用していますが、モジュール/コントローラーを定義するそれぞれのネストされた ng-apps と javascript を含む HTML になります。上記のコードは、複数のブートストラップを取得するためのトリックです。

于 2014-01-29T18:57:05.347 に答える