1

helloWorldz.js次のようなfile というファイルにディレクティブを作成しました。

'use strict';

angular.module('components')
  .directive('helloWorld', function () {
    return {
      restrict : 'E',
      template : '<span>Hello World</span>'
    };
});

私app.jsのルートを含む私のファイルは次のようになります:

'use strict';

angular.module('mmApp', ['components'])
  .config(function ($routeProvider) {
    $routeProvider
      .when('/designs', {
        templateUrl: 'views/designs.html',
        controller: 'MainCtrl'
      })
      .when('/blog', {
        templateUrl: 'views/blog.html',
        controller: 'MainCtrl'
      })   
      .otherwise({
        redirectTo: '/'
      });
  });

完了していない私のコントローラmain.jsは次のようになります:

'use strict';

angular.module('mmApp', [])
  .controller('MainCtrl', function ($scope) {
    $scope.designTiles = [
      { imageURL : "", title : "IMAGE" },
      { imageURL : "", title : "IMAGE" },
      { imageURL : "", title : "IMAGE" },
      { imageURL : "", title : "IMAGE" },
      { imageURL : "", title : "IMAGE" },
      { imageURL : "", title : "IMAGE" },
      { imageURL : "", title : "IMAGE" },
      { imageURL : "", title : "IMAGE" },
    ];
  });

Chrome Dev ToolshelloWorldz.jsは、正常にロードされていることを示しています。下記参照

ここに画像の説明を入力

コントローラーの後にディレクティブ コードを配置し、その後に引数としてmain.js渡すと、ディレクティブ コードが機能することがわかります。変更されたコントローラーは次のとおりです。['components']mmAppmain.js

'use strict';

angular.module('mmApp', ['components'])
  .controller('MainCtrl', function ($scope) {
    $scope.designTiles = [
      { imageURL : "", title : "IMAGE" },
      { imageURL : "", title : "IMAGE" },
      { imageURL : "", title : "IMAGE" },
      { imageURL : "", title : "IMAGE" },
      { imageURL : "", title : "IMAGE" },
      { imageURL : "", title : "IMAGE" },
      { imageURL : "", title : "IMAGE" },
      { imageURL : "", title : "IMAGE" },
    ];
  });

angular.module('components', [])
  .directive('helloWorld', function () {
    return {
      restrict : 'E',
      template : '<span>Hello World</span>'
    }
});

私のディレクティブを含むモジュールでapp.js正常に呼び出されないのはなぜですか? これは、に接続できないという可能性のある問題ですか?componentshelloWorldapp.jshelloWorldz.js

また、grunt を使用してすべてをコンパイルしていることにも言及する必要があります。

4

1 に答える 1

1

スタンドアローン版ではディレクティブのコードが少し違うようです。がある：

angular.module('components')

それ以外の

angular.module('components',[])

(スタンドアロン バージョンに引数を追加することによって) それを修正すると、問題が修正されるはずです。AngularJS のモジュール ページのトップ コメントは次のとおりであるため、多くの人がこれに遭遇したと思います。

このドキュメントでは、「angular.module('myModule', [])」は常に新しいモジュールを作成しますが、「angular.module('myModule')」は常に既存の参照を取得することを警告する必要があります。

于 2013-06-01T22:27:14.090 に答える