4

私は、AngularJS と RequireJS を使用して大規模なアプリを構築する初期段階にいます。すべてが find をロードしますが、ディレクティブは DOM を適切に操作していません。エラーは報告されておらず、アプリの残りの部分は正常に動作しています。ビューが読み込まれ、$scope がバインド可能です。コンソールを調べると、すべてのファイルがロードされていることがわかります。これは、ディレクティブが適切なタイミングでロードされていないという点で、遅延ロードの問題であると想定しています。この点に関して、ディレクティブを適切にロードする方法についての洞察をいただければ幸いです。Angular の jqLit​​e の一部でない限り、jQuery の提案は控えてください。

config.js

require.config({
  paths: { angular: '../vendor/angular' }
  shim: { angular: { exports: 'angular' } }
});
require(['angular'], function(angular) {
  angular.bootstrap(document, ['myApp']);
});

myApp.js

define(['angular', 'angular-resource'], function (angular) {
  return angular.module('myApp', ['ngResource']);
});

ルーティング.js

define(['myApp', 'controllers/mainCtrl'], function (myApp) {
  return myApp.config(['$routeProvider', function($routeProvider) {
    ...
  }]);
});

mainCtrl.js

define(['myApp', 'directives/myDirective'], function (myApp) {
  return myApp.controller('mainCtrl', ['$scope', function ($scope) {
    ...
  }]);
});

myDirective.js

require(['myApp'], function (myApp) {
  myApp.directive('superman', [function() {
    return {
      restrict: 'C',
      template: '<div>Here I am to save the day</div>'
    }
  }])
});

home.html

<div class="superman">This should be replaced</div>

home.html は ng-view にロードされるパーシャルです

4

1 に答える 1