Question

我正试图用Yeoman + Angular让我的脚离开并完成教程，即使我在教程中尝试的完全相同，我甚至无法获得最基本的指令。

有人可以提供一些关于我失踪的信息，过去2天我一直在努力解决这个问题

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渲染，但它仍然不会触发指令。我不知道角度脚本的加载顺序是否/如何重要，因为我不知道在哪里找到它。

Answer 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前缀通常由有角度的团队使用。在这种情况下，指令只是“调整大小”。

Answer 2

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

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

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

Yeoman Angularjs如何实施指令

2 个答案: