Angular、browserify、指令控制器不可用

Question

我正在测试 angular 和 browserify。应该是简单直接的。只是不是:(这是我的问题:

我的 src 文件夹中有一个目录结构，如下所示：

src/
 js/
  controller/
   index.js
   controller1.js
   ......
  directive/
    index.js
    directive1.js
    directive2.js

我的 directive/index.js 看起来像这样：

'use strict';

var app = angular.module('seisTools');
app.directive('fillController', require('./fill_controller'));
app.directive('fill', require('./fill'));

我的问题指令如下所示 (fill.js):

'use strict';
module.exports = function(){
    return{
        restrict: 'A',
        scope: {},
        require: '^fillController',
        link: function (scope, element, attr, ctrl) {
            var parent = $(element).parents('[fill]').get(0);
            var config = JSON.parse(attr.fill);
            ctrl.manageLayout(element, parent, config);
        }
    }
}

fillController 指令如下所示：

'use strict';

module.exports = function($window, $timeout){
    return {
        controller: function($scope){
            var me = this;
            me.manageElement = function(child, parent, config){
                console.log('managing an element');
            }
        }
    }
}

它需要 fillController 但 browserify 不提供它。我如何让 browserify 使这个 fillController 可用于我的 fill 指令？我把它们按正确的顺序排列，这应该是同步的，为什么它们不能像在同步环境中那样以正确的顺序创建？

谢谢！

Answer 1

您必须在 HTML 中使用这两个指令才能使 the require option 正常工作。我推荐这样的东西。

HTML:

<div fill fill-controller></div>
<!-- OR -->
<div fill-controller>
  <div fill></div>
</div>

fill.js:

// ...
// This will instruct the directive to look for the fillController directive
// on the same element the fill directive is on or a parent of it
require: '^fillController',
// ...

Angular、browserify、指令控制器不可用

Angular, browserify, directive controllers not available

angularjs

browserify