0

我正在尝试使用 Yeoman + Angular 让我的脚离开地面并阅读教程,即使我尝试与教程中完全相同的指令,我什至无法触发最基本的指令。

有人可以对我缺少的东西提供一些见解吗,过去两天我一直在努力解决这个问题


HTML 模板 - ng-resize 是预期的指令

<body ng-app="mvmdApp">
....
<div ng-mousemove="onMouse($event)" ng-resize="" class="youtube-cover ng-scope">
  <div class="youtube-unit"></div>
</div>


// controllers/youtube.js
'use strict';
angular.module('mvmdApp').controller('YoutubeCtrl', function($scope) {
  console.log('hi');// fires

  return $scope.onMouse = function(e) {}// fires


// directives/resize.js
'use strict';
angular.module('mvmdApp', []).directive('ngResize', function($window) {
  return function(scope) {
    return console.log('directive');// does not fire
  };
});

奇怪的是,每当我angular.module('mvmdApp', [])从指令脚本中这样调用时,它都会阻止视图呈现。

编辑:我还注意到,当我在所有其他脚本之前加载指令时,它不会阻止 html 呈现,但它仍然不会触发指令。我不知道角度脚本的加载顺序是否/如何重要,因为我不知道在哪里可以找到它。

4

2 回答 2

1

您正在多次声明该模块。您可以通过执行以下操作来简化此操作:

在 app.js 中:

'use strict';

var myApp = angular.module("mvmdApp", []);

myApp.config(function($routeProvider, $locationProvider) {
  ...
});

在 youtube.js 中:

'use strict';
myApp.controller('YoutubeCtrl', function($scope) {
  ...
});

resize.js 中的一个:

'use strict';

myApp.directive('resize', function($window) {
  ...
});

在http://plnkr.co/edit/Im4SpcyH4cIem6TDWZaG?p=preview更新了 plunker 。另外,我会避免调用指令“ng-resize”,因为 ng 前缀通常由 Angular 团队使用。在这种情况下,指令只是“调整大小”。

于 2013-09-04T06:03:07.087 回答
0

这可能无法解决您的问题,但我看到的一个错误是

angular.module('mvmdApp', [])在多个地方声明,resize.js 和 app.js。此格式声明每次都会使用此名称创建一个新模块。

这应该只从 app.js 调用一次。在 resize.js 中应该是angular.module('mvmdApp')

于 2013-09-04T04:20:41.010 回答