流星中的指令-angular
Directives in meteor-angular
上周早些时候,我发现了一个非常有趣的发现,'angular-meteor'。允许使用 AngularJS 框架的 Meteor 包。鉴于我有一些多余的空闲时间,这是假期和所有,我决定试一试。
我已经为我的 Web 应用程序编写了逻辑基础,但仍然存在一个非常非常令人困惑的问题。无论出于何种原因,脚本之外的所有 angular 相关函数与应用程序的实例化都不起作用。
client/index.html
<body ng-app="aboutjn"
ng-controller="mainCtrl">
<stdLayout></stdLayout>
</body>
client/app/module.js
angular.module('aboutjn',['angular-meteor']); // # initialize angular module
/*
* ANGULAR-METEOR CHEAT-SHEET
* @ newbie guide
$root.currentUser =>
*/
angular.module('aboutjn')
.controller('mainCtrl', ['$scope', '$reactive', function ($scope, $reactive) {
$reactive(this).attach($scope);
// create reactive context within scope
$scope.helpers({
posts: function() {
return Posts.find({}, {sort: {createdAt: -1}})
}
}); // meteor style helper to instantiate scope context
console.log('test #1'); // # passed
}]);
client/app/shared/layout/directive.js
console.log('test #2'); // # passed
var module = angular.module('aboutjn');
module.run(function() {
console.log('test #3'); // # failed
});
module.directive('std-layout', function() {
return {
restrict: 'E',
templateUrl: 'client/app/shared/layout/view/stdLayout.html',
controllerAs: 'layoutCtrl',
controller: function () {
console.log('test #4'); // # failed
}
};
});
结果
- 测试#1(通过)
- 测试#2(通过)
- 测试 #3(失败)
- 测试#4(失败)
我把我的项目搁置到今天早些时候,当时我决定尝试一些新的东西。我检查了我的脚本的加载顺序,并意识到模块是在我的指令和控制器之后加载的。
我通过将主模块移动到 /lib 子目录中解决了这个问题。
上周早些时候,我发现了一个非常有趣的发现,'angular-meteor'。允许使用 AngularJS 框架的 Meteor 包。鉴于我有一些多余的空闲时间,这是假期和所有,我决定试一试。
我已经为我的 Web 应用程序编写了逻辑基础,但仍然存在一个非常非常令人困惑的问题。无论出于何种原因,脚本之外的所有 angular 相关函数与应用程序的实例化都不起作用。
client/index.html
<body ng-app="aboutjn"
ng-controller="mainCtrl">
<stdLayout></stdLayout>
</body>
client/app/module.js
angular.module('aboutjn',['angular-meteor']); // # initialize angular module
/*
* ANGULAR-METEOR CHEAT-SHEET
* @ newbie guide
$root.currentUser =>
*/
angular.module('aboutjn')
.controller('mainCtrl', ['$scope', '$reactive', function ($scope, $reactive) {
$reactive(this).attach($scope);
// create reactive context within scope
$scope.helpers({
posts: function() {
return Posts.find({}, {sort: {createdAt: -1}})
}
}); // meteor style helper to instantiate scope context
console.log('test #1'); // # passed
}]);
client/app/shared/layout/directive.js
console.log('test #2'); // # passed
var module = angular.module('aboutjn');
module.run(function() {
console.log('test #3'); // # failed
});
module.directive('std-layout', function() {
return {
restrict: 'E',
templateUrl: 'client/app/shared/layout/view/stdLayout.html',
controllerAs: 'layoutCtrl',
controller: function () {
console.log('test #4'); // # failed
}
};
});
结果
- 测试#1(通过)
- 测试#2(通过)
- 测试 #3(失败)
- 测试#4(失败)
我把我的项目搁置到今天早些时候,当时我决定尝试一些新的东西。我检查了我的脚本的加载顺序,并意识到模块是在我的指令和控制器之后加载的。
我通过将主模块移动到 /lib 子目录中解决了这个问题。