I have a meanjs.org skeleton app, that I have converted to hapi-js instead of express, also converted to postgres instead of mongo, and used OAUTH for authentication. (ok, so really, I just liked the folder structure for server/client modules - lol)
我有一个meanjs.org的骨架应用程序,我将它转换为hapi-js而不是express,也转换为postgres而不是mongo,并使用OAUTH进行身份验证。(好吧,实际上,我只是喜欢服务器/客户端模块的文件夹结构——lol)
All of this works EXCEPT, my Angular deployment (kind of big deal). It is angular 1.6.5 (I don't have time to learn TS and A2). It loads all of the module components without error, the routes, etc all without error. The 1 thing that fails is this line after document.ready:
所有这些都是可行的,但我的角部署(有点大)。它的角度是1.6.5(我没有时间学习TS和A2)。它加载所有的模块组件,没有错误,路由,等等都没有错误。失败的一件事是在文件之后的这一行。
angular.bootstrap(document, [app.applicationModuleName]);
角。引导(文档,[app.applicationModuleName]);
If I comment this out and add ng-app="appName"
to HTML instead of using the bootstrap method, I get the same result... this error:
如果我将其注释掉并将ng-app="appName"添加到HTML,而不是使用bootstrap方法,我得到的结果是相同的……这个错误:
Failed to instantiate module appN due to: Error: [$injector:modulerr]
未能实例化模块appN,因为:错误:[$injector:modulerr]
I have confirmed everything else is loading without error... not sure where to go from here... any advice?
我已经确认了其他一切都没有错误……不知道从这里往哪里走……任何建议吗?
@matias requested full code, here is the angular config:
@matias请求完整的代码,这里是角度配置:
(function (window) {
'use strict';
var applicationModuleName = 'appName';
var service = {
applicationEnvironment: window.env,
applicationModuleName: applicationModuleName,
applicationModuleVendorDependencies: ['ngResource', 'ngAnimate', 'ngMessages', 'ui.router', 'ui.bootstrap','ui-notification'],
registerModule: registerModule
};
window.ApplicationConfiguration = service;
// Add a new vertical module
function registerModule(moduleName, dependencies) {
// Create angular module
angular.module(moduleName, dependencies || []);
// Add the module to the AngularJS configuration file
angular.module(applicationModuleName).requires.push(moduleName);
}
// Angular-ui-notification configuration
angular.module('ui-notification').config(function(NotificationProvider) {
NotificationProvider.setOptions({
delay: 2000,
startTop: 20,
startRight: 10,
verticalSpacing: 20,
horizontalSpacing: 20,
positionX: 'right',
positionY: 'bottom'
});
});
}(window));
AND here is the angular init (config loads first, then the init):
这里有一个角init(先配置加载,然后是init):
(function (app) {
'use strict';
// Start by defining the main module and adding the module dependencies
angular
.module(app.applicationModuleName, app.applicationModuleVendorDependencies);
// Setting HTML5 Location Mode
angular
.module(app.applicationModuleName)
.config(bootstrapConfig);
bootstrapConfig.$inject = ['$compileProvider', '$locationProvider', '$httpProvider', '$logProvider'];
function bootstrapConfig($compileProvider, $locationProvider, $httpProvider, $logProvider) {
$locationProvider.html5Mode({
enabled: true,
requireBase: false
}).hashPrefix('!');
$httpProvider.interceptors.push('authInterceptor');
// Disable debug data for production environment
// @link https://docs.angularjs.org/guide/production
$compileProvider.debugInfoEnabled(app.applicationEnvironment !== 'production');
$logProvider.debugEnabled(app.applicationEnvironment !== 'production');
}
// Then define the init function for starting up the application
angular.element(document).ready(init);
function init() {
// Fixing facebook bug with redirect
if (window.location.hash && window.location.hash === '#_=_') {
if (window.history && history.pushState) {
window.history.pushState('', document.title, window.location.pathname);
} else {
// Prevent scrolling by storing the page's current scroll offset
var scroll = {
top: document.body.scrollTop,
left: document.body.scrollLeft
};
window.location.hash = '';
// Restore the scroll offset, should be flicker free
document.body.scrollTop = scroll.top;
document.body.scrollLeft = scroll.left;
}
}
// Then init the app
angular.bootstrap(document, [app.applicationModuleName]);
}
}(ApplicationConfiguration));
2 个解决方案
#1
1
Try this, first you have to create your app (name + list of dependencies):
尝试一下,首先你必须创建你的应用程序(名称+附件列表):
var app = angular.module('myApp', []);
And then, bootstrap your app:
然后,引导你的应用程序:
angular.bootstrap(document, [app.name]);
#2
0
Well. I feel sheepish. I tried a much simpler approach and step in to what I was doing to see if I could find the culprit.
好。我觉得羞怯。我尝试了一种简单得多的方法,然后介入我正在做的事情,看看是否能找到罪犯。
Turns out, my injection of ui.bootstrap was the item failing (thanks @estus - your comments led me to dig deeper on the other modules). It was failing because I am lame, and fat fingered the path in the asset pipeline, so the library didn't exist on the page.
结果是,我的ui注入。bootstrap是项目失败(感谢@estus),您的评论导致我在其他模块上更深入地挖掘。它之所以失败,是因为我是瘸子,而且胖手指着资产管道的路径,所以这个库并不存在于页面上。
*hangs head in shame*
羞愧的* *挂头
Thank you all for the quick help. Much appreciated.
谢谢大家的快速帮助。感谢。
#1
1
Try this, first you have to create your app (name + list of dependencies):
尝试一下,首先你必须创建你的应用程序(名称+附件列表):
var app = angular.module('myApp', []);
And then, bootstrap your app:
然后,引导你的应用程序:
angular.bootstrap(document, [app.name]);
#2
0
Well. I feel sheepish. I tried a much simpler approach and step in to what I was doing to see if I could find the culprit.
好。我觉得羞怯。我尝试了一种简单得多的方法,然后介入我正在做的事情,看看是否能找到罪犯。
Turns out, my injection of ui.bootstrap was the item failing (thanks @estus - your comments led me to dig deeper on the other modules). It was failing because I am lame, and fat fingered the path in the asset pipeline, so the library didn't exist on the page.
结果是,我的ui注入。bootstrap是项目失败(感谢@estus),您的评论导致我在其他模块上更深入地挖掘。它之所以失败,是因为我是瘸子,而且胖手指着资产管道的路径,所以这个库并不存在于页面上。
*hangs head in shame*
羞愧的* *挂头
Thank you all for the quick help. Much appreciated.
谢谢大家的快速帮助。感谢。