How to use the aurelia-dialog plugin with Aurelia? - javascript

I'm having trouble setting up the aurelia-dialog plugin (0.2.0) with my test Aurelia app.
Unfortunately, the README.MD file that details how to accomplish this has some serious holes. First, it doesn't mention having to inject the aureliaDialog into your class, so I tried this first:
#inject(HttpClient, DialogService)
export class MyClass{
constructor(http, dialogService) {
this.http = http;
this.dialogService = dialogService;
}
...
}
I tried to invoke the dialog box using:
this.dialogService.open({ viewModel: Prompt, model: 'Good or Bad?' })
The above results in the following errors:
Unhandled promise rejection ReferenceError: info is not defined
at Container.invoke (http://127.0.0.1:9000/jspm_packages/github/aurelia/dependency-injection#0.10.0/aurelia-dependency-injection.js:401:30)
at Array.<anonymous> (http://127.0.0.1:9000/jspm_packages/github/aurelia/dependency-injection#0.10.0/aurelia-dependency-injection.js:272:44)
at Container.get (http://127.0.0.1:9000/jspm_packages/github/aurelia/dependency-injection#0.10.0/aurelia-dependency-injection.js:329:24)
at http://127.0.0.1:9000/jspm_packages/github/aurelia/templating#0.15.1/aurelia-templating.js:3685:75
at run (http://127.0.0.1:9000/jspm_packages/npm/core-js#0.9.18/modules/es6.promise.js:91:43)
at http://127.0.0.1:9000/jspm_packages/npm/core-js#0.9.18/modules/es6.promise.js:105:11
at module.exports (http://127.0.0.1:9000/jspm_packages/npm/core-js#0.9.18/modules/$.invoke.js:6:25)
at queue.(anonymous function) (http://127.0.0.1:9000/jspm_packages/npm/core-js#0.9.18/modules/$.task.js:40:9)
at Number.run (http://127.0.0.1:9000/jspm_packages/npm/core-js#0.9.18/modules/$.task.js:27:7)
at listner (http://127.0.0.1:9000/jspm_packages/npm/core-js#0.9.18/modules/$.task.js:31:9) Unhandled promise rejection ReferenceError: info is not defined(…)(anonymous function) # es6.promise.js:139module.exports # $.invoke.js:6queue.(anonymous function) # $.task.js:40run # $.task.js:27listner # $.task.js:31
Next, I tried to add the configuration of the plugin to my main.js file:
export function configure(aurelia) {
aurelia.use
.standardConfiguration()
.developmentLogging()
.plugin('aurelia-animator-css')
.plugin('aurelia-dialog'); // <----- this is what I added
aurelia.start().then(a => a.setRoot());
}
Now my app doesn't start at all and produces the following error while trying (and failing) to start:
DEBUG [aurelia] Configured plugin aurelia-dialog. aurelia-logging-console.js:38
DEBUG [templating] importing resources for undefined [] es6.promise.js:139
Unhandled promise rejection Error: Cannot read property 'querySelectorAll' of undefined(…)
(anonymous function) # es6.promise.js:139module.exports # $.invoke.js:6queue.
(anonymous function) # $.task.js:40run # $.task.js:27listner # $.task.js:31
I am now at a loss of what to try next. Thanks for any insight you can offer with this issue.
I'm also hopeful that the maintainer of the aurelia-dialog plugin revises the docs to make the setup process less painful.
Thanks,
Greg

In the end, the problem turned out to be a bug in aurelia-dialog 0.2.0. Version 0.2.1 fixes the issue I couldn't resolve on my own: https://github.com/aurelia/dialog/pull/24.
The other steps that I had to follow are still necessary - you will need to inject the DialogService class and modify your main.js file to add the configuration.

Related

Webpack minimize option breaks application if set to true

I am experiencing an issue about webpack: if I set config.optimization.minimize: false, webpack produces not-minified bundle files (polyfills, vendor and app), then I run the server and all works fine. If I change the option to config.optimization.minimize: false I am getting following AngularJS (1.7.9) error:
jquery.min.js:2 Uncaught Error: [$injector:modulerr] Failed to instantiate module saServer2App due to:
Error: [$injector:modulerr] Failed to instantiate module saServer2App.account due to:
Error: [$injector:unpr] Unknown provider: e
https://errors.angularjs.org/1.7.9/$injector/modulerr?p0=saServer2App&p1=Error%3A%20%5B%24injector%3Amodulerr%5D%20Failed%20to%20instantiate%20module%20saServer2App.account%20due%20to%3A%0AError%3A%20%5B%24injector%3Aunpr%5D%20Unknown%20provider%3A%20e%0A%0Ahttps%3A%2F%2Ferrors.angularjs.org%2F1.7.9%2F%24injector%2Fmodulerr%3Fp0%3DsaServer2App.account%26p1%3DError%253A%2520%255B%2524injector%253Aunpr%255D%2520Unknown%2520provider%253A%2520e%250Ahttps%253A%252F%252Ferrors.angularjs.org%252F1.7.9%252F%2524injector%252Funpr%253Fp0%253De%250A%2520%2520%2520%2520at%2520http%253A%252F%252Flocalhost%253A9000%252Fvendor.bundle.js%253A7%253A837%250A%2520%2520%2520%2520at%2520http%253A%252F%252Flocalhost%253A9000%252Fvendor.bundle.js%253A7%253A23977%250A%2520%2520%2520%2520at%2520u%2520(http%253A%252F%252Flocalhost%253A9000%252Fvendor.bundle.js%253A7%253A25576)%250A%2520%2520%2520%2520at%2520s%2520(http%253A%252F%252Flocalhost%253A9000%252Fvendor.bundle.js%253A7%253A25881)%250A%2520%2520%2520%2520at%2520Object.invoke%2520(http%253A%252F%252Flocalhost%253A9000%252Fvendor.bundle.js%253A7%253A25969)%250A%2520%2520%2520%2520at%2520r%2520(http%253A%252F%252Flocalhost%253A9000%252Fvendor.bundle.js%253A7%253A25365)%250A%2520%2520%2520%2520at%2520http%253A%252F%252Flocalhost%253A9000%252Fvendor.bundle.js%253A7%253A25009%250A%2520%2520%2520%2520at%2520x%2520(http%253A%252F%252Flocalhost%253A9000%252Fvendor.bundle.js%253A7%253A1529)%250A%2520%2520%2520%2520at%2520g%2520(http%253A%252F%252Flocalhost%253A9000%252Fvendor.bundle.js%253A7%253A24869)%250A%2520%2520%2520%2520at%2520http%253A%252F%252Flocalhost%253A9000%252Fvendor.bundle.js%253A7%253A24955%250A%2520%2520%2520%2520at%2520x%2520(http%253A%252F%252Flocalhost%253A9000%252Fvendor.bundle.js%253A7%253A1529)%250A%2520%2520%2520%2520at%2520g%2520(http%253A%252F%252Flocalhost%253A9000%252Fvendor.bundle.js%253A7%253A24869)%250A%2520%2520%2520%2520at%2520We%2520(http%253A%252F%252Flocalhost%253A9000%252Fvendor.bundle.js%253A7%253A24189)%250A%2520%2520%2520%2520at%2520i%2520(http%253A%252F%252Flocalhost%253A9000%252Fvendor.bundle.js%253A7%253A10341)%250A%2520%2520%2520%2520at%2520Object.Et%2520%255Bas%2520bootstrap%255D%2520(http%253A%252F%252Flocalhost%253A9000%252Fvendor.bundle.js%253A7%253A10656)%250A%2520%2520%2520%2520at%2520HTMLDocument.%253Canonymous%253E%2520(http%253A%252F%252Flocalhost%253A9000%252Fapp.bundle.js%253A348%253A233259)%250A%2520%2520%2520%2520at%2520e%2520(http%253A%252F%252Flocalhost%253A9000%252Flibs%252Fjquery.min.js%253A2%253A30005)%250A%2520%2520%2520%2520at%2520t%2520(http%253A%252F%252Flocalhost%253A9000%252Flibs%252Fjquery.min.js%253A2%253A30307)%0A%20%20%20%20at%20http%3A%2F%2Flocalhost%3A9000%2Fvendor.bundle.js%3A7%3A837%0A%20%20%20%20at%20http%3A%2F%2Flocalhost%3A9000%2Fvendor.bundle.js%3A7%3A25194%0A%20%20%20%20at%20x%20(http%3A%2F%2Flocalhost%3A9000%2Fvendor.bundle.js%3A7%3A1529)%0A%20%20%20%20at%20g%20(http%3A%2F%2Flocalhost%3A9000%2Fvendor.bundle.js%3A7%3A24869)%0A%20%20%20%20at%20http%3A%2F%2Flocalhost%3A9000%2Fvendor.bundle.js%3A7%3A24955%0A%20%20%20%20at%20x%20(http%3A%2F%2Flocalhost%3A9000%2Fvendor.bundle.js%3A7%3A1529)%0A%20%20%20%20at%20g%20(http%3A%2F%2Flocalhost%3A9000%2Fvendor.bundle.js%3A7%3A24869)%0A%20%20%20%20at%20We%20(http%3A%2F%2Flocalhost%3A9000%2Fvendor.bundle.js%3A7%3A24189)%0A%20%20%20%20at%20i%20(http%3A%2F%2Flocalhost%3A9000%2Fvendor.bundle.js%3A7%3A10341)%0A%20%20%20%20at%20Object.Et%20%5Bas%20bootstrap%5D%20(http%3A%2F%2Flocalhost%3A9000%2Fvendor.bundle.js%3A7%3A10656)%0A%20%20%20%20at%20HTMLDocument.%3Canonymous%3E%20(http%3A%2F%2Flocalhost%3A9000%2Fapp.bundle.js%3A348%3A233259)%0A%20%20%20%20at%20e%20(http%3A%2F%2Flocalhost%3A9000%2Flibs%2Fjquery.min.js%3A2%3A30005)%0A%20%20%20%20at%20t%20(http%3A%2F%2Flocalhost%3A9000%2Flibs%2Fjquery.min.js%3A2%3A30307)
at vendor.6729935a0c85787ce014.bundle.js:895
at vendor.6729935a0c85787ce014.bundle.js:5819
at x (vendor.6729935a0c85787ce014.bundle.js:1144)
at g (vendor.6729935a0c85787ce014.bundle.js:5779)
at We (vendor.6729935a0c85787ce014.bundle.js:5696)
at i (vendor.6729935a0c85787ce014.bundle.js:2719)
at Object.Et [as bootstrap] (vendor.6729935a0c85787ce014.bundle.js:2740)
at HTMLDocument.<anonymous> (app.js:74)
at e (jquery.min.js:2)
at t (jquery.min.js:2)
This is a bit strange, especially to me that I am new in AngularJS and Webpack. The only thing I change between the two scenarios is only the minimize flag. What could be wrong?
Feel free to ask some portions of my files/codes I needed.
AngularJs dependency injection is based on the function argument names.
For example:
class AuthService {
constructor(otherService) {
// ------------^ will inject otherService
}
}
angular.module('my-app', []).service('authService', AuthService);
The problem is that when you minify your code, the minifier will replace function arguments into something shorter (usually one char).
This is what happens in your case, this explains why the angular tries to inject e (Error: [$injector:unpr] Unknown provider: e).
In order to overcome this issue, angular supports array notation which defines the dependencies as a string.
// Given
const MyController = function (obfuscatedScope, obfuscatedRoute) {
// ...
};
// Define function dependencies
MyController['$inject'] = ['$scope', '$route'];
There is a webpack plugin which annotates automatically, ng-annotate-webpack-plugin.
It handles most of the cases, but sometime you need to help it by adding a special comment.
class AuthService {
/* #ngInject */
constructor(otherService) {
// ------------^ will inject otherService
}
}
angular.module('my-app', []).service('authService', AuthService);
If you are a babel user, check this babel plugin.

Trying to require or import a npm installed module inside a vuepress component

I have 'npm install -S tabletop' into my vuepress site and I am struggling to either import or require the tabletop module.
I know next to nothing about webpack nor the internals of vuepress (this is nmy first vuepress project)
Building a static website for a friend but planning to use a google spreadsheet to hold current work opportunities and suck the line entries using tabletop.js (https://www.npmjs.com/package/tabletop) into a JSON then filter and loop through to present in a vuepress loop
However, I've failed at step one of this process ... using tabletop.js inside a vuepress container's tag
Hi all, I'm new to vuepress and webpack and I'm getting a headache over trying to use a javascript library. I'm familiar with javascript and writing my own scripts and also loading javascript libraries in raw html websites. But I've really got stuck trying to figure out where the relative path for a require statement should be
I've tried both npm installing and also inserting into the config.js HEAD (which appears in devtools) options 1 and/or 2 below
install tabletop.js with
npm install -S tabletop
2.add link to config.js' HEAD
module.exports = {
title: 'Starlife Company Services Ltd',
description: 'Cleaning and Security services across the South East',
head: [
['link', { type: 'text/javscript', src: 'https://cdnjs.cloudflare.com/ajax/libs/tabletop.js/1.5.1/tabletop.min.js' }]
]
}
add a require in tags in component
<template>
....
</template>
<script>
export default {
name: "cleaning-cta"
};
console.log("script started from inside joblist.vue")
import as sheet from 'tabletop'
var recruitment = "https://docs.google.com/spreadsheets/d/1M7glQxJb31B3lQyKNqum5o-0eDAgKI54VBPUAJomIFM/pubhtml" ;
console.log(recruitment);
var tabletop = sheet.init({
key: '1M7glQxJb31B3lQyKNqum5o-0eDAgKI54VBPUAJomIFM',
callback: showInfo
})
</script>
I've tried various combinations of
import 'tabletop'
Tabletop.init(...)
-or-
require('tabletop')
import as from 'tabletop'
I've tried various relative pathways
'tabletop'
'./tabletop'
'../../tabletop'
'../../node_modules/tabletop'
without no avail all with either a require or an import or a HEAD inserted sript tag
without a path I get
vue.runtime.esm.js?4bfb:619 [Vue warn]: Failed to resolve async component: function () {
return Promise.all(/*! import() */[__webpack_require__.e(20), __webpack_require__.e(29)]).then(__webpack_require__.bind(null, /*! ./src/.vuepress/components/joblist */ "./src/.vuepress/components/joblist.vue"));
}
Reason: ReferenceError: Tabletop is not defined
with a relative path I get ...
client?cae4:159 ./src/.vuepress/components/joblist.vue?vue&type=script&lang=js& (./node_modules/cache-loader/dist/cjs.js??ref--3-0!/usr/local/lib/node_modules/vuepress/node_modules/babel-loader/lib??ref--3-1!./node_modules/cache-loader/dist/cjs.js??ref--0-0!/usr/local/lib/node_modules/vuepress/node_modules/vue-loader/lib??vue-loader-options!./src/.vuepress/components/joblist.vue?vue&type=script&lang=js&)
Module not found: Error: Can't resolve '../../tabletop' in '/home/pi/GitHub/starlife-website/src/.vuepress/components'
errors # client?cae4:159
(anonymous) # socket.js?e29c:47
sock.onmessage # SockJSClient.js?0a33:58
EventTarget.dispatchEvent # sockjs.js?fb87:170
(anonymous) # sockjs.js?fb87:887
SockJS._transportMessage # sockjs.js?fb87:885
EventEmitter.emit # sockjs.js?fb87:86
WebSocketTransport.ws.onmessage # sockjs.js?fb87:2961
vue.runtime.esm.js?4bfb:619 [Vue warn]: Failed to resolve async component: function () {
return __webpack_require__.e(/*! import() */ 20).then(__webpack_require__.bind(null, /*! ./src/.vuepress/components/joblist */ "./src/.vuepress/components/joblist.vue"));
}
Reason: Error: Cannot find module '../../tabletop'
Every variation of the path both for import or require seems to end up in the same two errors:
Error: Cannot find module '../../tabletop'
-or-
Reason: ReferenceError: Tabletop is not defined
After several hours I'm lost ... spent hours googling for examples none of which are based within vuepress and none have been helpful
With Insuffiicent knowledge to poke through webpack, and running out of alternatives my project has hit a wall and I cannot see my way around.
Any ideas are much appreciated
Current state of project can be found at
https://github.com/kingdom-values-clients/starlife-website/tree/345d55eed65f110626a9e4d3bcadae1efcca0cbc
See above and also in thes commit
https://github.com/kingdom-values-clients/starlife-website/tree/345d55eed65f110626a9e4d3bcadae1efcca0cbc
Error: Cannot find module '../../tabletop'
-or-
Reason: ReferenceError: Tabletop is not defined
I know I'm probably doing something dumb here but cannot figure it out nor can I find any help for anything remotely like this inside a vuepress component.

How to add my own node.js script to Angular 4 project

I have a file function.js which exports function to comunicate with some api and return value. It comunicates using request library. I am using this in node.js app. How can I import/use it in my angular 4 app?
I thought to install this file as node_module. So I created new folder function
where is function.js, package-json and node_modules folder. and then I installed it in my ng4 app by command
npm install --save ./function
then in typings.d.ts I declare it
declare var Myfunction: any
and import it in my component
import * as Myfunction from "function"
but when i try using it I get an error :
ERROR in /Users/i343346/order-site/src/app/order/order.component.ts (37,12): Unexpected token. A constructor, method, accessor, or property was expected.
ERROR in /Users/i343346/order-site/src/app/order/order.component.ts (37,13): Function implementation is missing or not immediately following the declaration.
UPDATE
I tried #Z. Bagley answear and now i can import my file. but got error:
WARNING in ./node_modules/ajv/lib/compile/index.js 13:21-34 Critical dependency: the request of a dependency is an expression
at CommonJsRequireContextDependency.getWarnings (/Users/i343346/order-site/node_modules/webpack/lib/dependencies/CommonJsRequireContextDependency.js:27:4)
at Compilation.reportDependencyErrorsAndWarnings (/Users/i343346/order-site/node_modules/webpack/lib/Compilation.js:677:24)
at Compilation.finish (/Users/i343346/order-site/node_modules/webpack/lib/Compilation.js:535:9)
at applyPluginsParallel.err (/Users/i343346/order-site/node_modules/webpack/lib/Compiler.js:512:17)
at /Users/i343346/order-site/node_modules/tapable/lib/Tapable.js:289:11
at _addModuleChain (/Users/i343346/order-site/node_modules/webpack/lib/Compilation.js:481:11)
at processModuleDependencies.err (/Users/i343346/order-site/node_modules/webpack/lib/Compilation.js:452:13)
at _combinedTickCallback (internal/process/next_tick.js:73:7)
at process._tickCallback (internal/process/next_tick.js:104:9)
WARNING in ./node_modules/ajv/lib/async.js 96:20-33 Critical dependency: the request of a dependency is an expression
at CommonJsRequireContextDependency.getWarnings (/Users/i343346/order-site/node_modules/webpack/lib/dependencies/CommonJsRequireContextDependency.js:27:4)
at Compilation.reportDependencyErrorsAndWarnings (/Users/i343346/order-site/node_modules/webpack/lib/Compilation.js:677:24)
at Compilation.finish (/Users/i343346/order-site/node_modules/webpack/lib/Compilation.js:535:9)
at applyPluginsParallel.err (/Users/i343346/order-site/node_modules/webpack/lib/Compiler.js:512:17)
at /Users/i343346/order-site/node_modules/tapable/lib/Tapable.js:289:11
at _addModuleChain (/Users/i343346/order-site/node_modules/webpack/lib/Compilation.js:481:11)
at processModuleDependencies.err (/Users/i343346/order-site/node_modules/webpack/lib/Compilation.js:452:13)
at _combinedTickCallback (internal/process/next_tick.js:73:7)
at process._tickCallback (internal/process/next_tick.js:104:9)
WARNING in ./node_modules/ajv/lib/async.js 119:15-28 Critical dependency: the request of a dependency is an expression
at CommonJsRequireContextDependency.getWarnings (/Users/i343346/order-site/node_modules/webpack/lib/dependencies/CommonJsRequireContextDependency.js:27:4)
at Compilation.reportDependencyErrorsAndWarnings (/Users/i343346/order-site/node_modules/webpack/lib/Compilation.js:677:24)
at Compilation.finish (/Users/i343346/order-site/node_modules/webpack/lib/Compilation.js:535:9)
at applyPluginsParallel.err (/Users/i343346/order-site/node_modules/webpack/lib/Compiler.js:512:17)
at /Users/i343346/order-site/node_modules/tapable/lib/Tapable.js:289:11
at _addModuleChain (/Users/i343346/order-site/node_modules/webpack/lib/Compilation.js:481:11)
at processModuleDependencies.err (/Users/i343346/order-site/node_modules/webpack/lib/Compilation.js:452:13)
at _combinedTickCallback (internal/process/next_tick.js:73:7)
at process._tickCallback (internal/process/next_tick.js:104:9)
I think is connected with request library, which maybe isn't supported by browser.
A simple way to include custom javascript functions in your Angular 4 project is to include the item in your assets folder, and then use require to import it into your component typescript.
src/assets/example.js
export function test() {
console.log('test');
}
src/app/app.component.ts
(before #Component(...))
declare var require: any;
const example = require('../assets/example');
(inside export class AppComponent implements OnInit { ...)
ngOnInit() {
example.test();
}
I think you might also need to include your code in index.html via script tag.
You might find this other answer useful: https://stackoverflow.com/posts/40635697/edit

NativeImage not working in setOverlayIcon() in Electron

I'm trying to make a numeric badge for my app's taskbar icon (Windows 10). I've used this code as a starting point and modified it a bit. After creating the badge, I've used the following to set it in the renderer process:
var electron=require('electron'),
remote=electron.remote,
nativeImage=electron.nativeImage;
...
var win=remote.getCurrentWindow();
...
var badgeDataURL=canvas.toDataURL();
var img=nativeImage.createFromDataURL(badgeDataURL);
win.setOverlayIcon(img,''+n);
Running this gives me the following error:
Uncaught Error: Could not call remote function 'setOverlayIcon'. Check that the function signature is correct. Underlying error: Error processing argument at index 0, conversion failure from #<Object>
Error: Could not call remote function 'setOverlayIcon'. Check that the function signature is correct. Underlying error: Error processing argument at index 0, conversion failure from #<Object>
at callFunction (A:\electron\resources\electron.asar\browser\rpc-server.js:235:11)
at EventEmitter.<anonymous> (A:\electron\resources\electron.asar\browser\rpc-server.js:342:5)
at emitMany (events.js:127:13)
at EventEmitter.emit (events.js:201:7)
at WebContents.<anonymous> (A:\electron\resources\electron.asar\browser\api\web-contents.js:231:13)
at emitTwo (events.js:106:13)
at WebContents.emit (events.js:191:7)metaToValue # A:\electron\resources\electron.asar\renderer\api\remote.js:217remoteMemberFunction # A:\electron\resources\electron.asar\renderer\api\remote.js:113electronSetBadge # app.js:81updateBadge # app.js:156initClick # app.js:183(anonymous function) # app.js:203dispatch # jquery-1.12.4.min.js:3r.handle # jquery-1.12.4.min.js:3
I've tried the following:
different versions of Electron (1.4.13 and 1.2.8)
testing the contents of badgeDataURL and img and it's a valid image
testing setOverlayIcon with a static image: win.setOverlayIcon(__dirname+'/pics/badge.png',''+n) (and it works)
win.setOverlayIcon(null,'') also works
Although the documentation says that setOverlayIcon expects the first parameter to be of the NativeImage type I haven't been able to find a working example anywhere. Any ideas?
For me, setOverlayIcon needed to be run from the main process. Here is what fixed it on my side:
In my renderer process:
ipcRenderer.send('update-badge', canvas.toDataURL())
And in my main process:
ipcMain.on('update-badge', (event, data) => {
let img = nativeImage.createFromDataURL(data)
win.setOverlayIcon(img, 'description')
}

How to use angular-acl in a angular-meteor project?

I'm pretty new to Angular and Meteor. I'm trying to create a project using Angular-Meteor.
A part of my Angular app.js is as follows.
import AclService from 'angular-acl';
angular.module('myApp', [angularMeteor, uiRouter,AclService, 'accounts.ui']);
I'm trying to use the Angular-ACL plugin.
When I run the app, I get the following error in the browser console.
VM4605 modules.js?hash=afc491d…:232 Uncaught Error: [$injector:modulerr]
Failed to instantiate module myApp due to:
Error: [$injector:modulerr] Failed to instantiate module {} due to:
Error: [ng:areq] Argument 'module' is not a function, got Object
http://errors.angularjs.org/1.5.3/ng/areq?p0=module&p1=not%20a%20function%2C%20got%20Object
at http://localhost:3000/packages/modules.js?hash=afc491df237c732f4ec721460c9455fc18cc0d9d:232:12
at assertArg (http://localhost:3000/packages/modules.js?hash=afc491df237c732f4ec721460c9455fc18cc0d9d:2008:11)
at assertArgFn (http://localhost:3000/packages/modules.js?hash=afc491df237c732f4ec721460c9455fc18cc0d9d:2018:3)
at http://localhost:3000/packages/modules.js?hash=afc491df237c732f4ec721460c9455fc18cc0d9d:4697:11
at forEach (http://localhost:3000/packages/modules.js?hash=afc491df237c732f4ec721460c9455fc18cc0d9d:485:20)
at loadModules (http://localhost:3000/packages/modules.js?hash=afc491df237c732f4ec721460c9455fc18cc0d9d:4672:5)
at http://localhost:3000/packages/modules.js?hash=afc491df237c732f4ec721460c9455fc18cc0d9d:4689:40
at forEach (http://localhost:3000/packages/modules.js?hash=afc491df237c732f4ec721460c9455fc18cc0d9d:485:20)
at loadModules (http://localhost:3000/packages/modules.js?hash=afc491df237c732f4ec721460c9455fc18cc0d9d:4672:5)
at createInjector (http://localhost:3000/packages/modules.js?hash=afc491df237c732f4ec721460c9455fc18cc0d9d:4594:19)
http://errors.angularjs.org/1.5.3/$injector/modulerr?p0=%7B%7D&p1=Error%3A%…2Fmodules.js%3Fhash%3Dafc491df237c732f4ec721460c9455fc18cc0d9d%3A4594%3A19)
at http://localhost:3000/packages/modules.js?hash=afc491df237c732f4ec721460c9455fc18cc0d9d:232:12
at http://localhost:3000/packages/modules.js?hash=afc491df237c732f4ec721460c9455fc18cc0d9d:4711:15
at forEach (http://localhost:3000/packages/modules.js?hash=afc491df237c732f4ec721460c9455fc18cc0d9d:485:20)
at loadModules (http://localhost:3000/packages/modules.js?hash=afc491df237c732f4ec721460c9455fc18cc0d9d:4672:5)
at http://localhost:3000/packages/modules.js?hash=afc491df237c732f4ec721460c9455fc18cc0d9d:4689:40
at forEach (http://localhost:3000/packages/modules.js?hash=afc491df237c732f4ec721460c9455fc18cc0d9d:485:20)
at loadModules (http://localhost:3000/packages/modules.js?hash=afc491df237c732f4ec721460c9455fc18cc0d9d:4672:5)
at createInjector (http://localhost:3000/packages/modules.js?hash=afc491df237c732f4ec721460c9455fc18cc0d9d:4594:19)
at doBootstrap (http://localhost:3000/packages/modules.js?hash=afc491df237c732f4ec721460c9455fc18cc0d9d:1874:20)
at bootstrap (http://localhost:3000/packages/modules.js?hash=afc491df237c732f4ec721460c9455fc18cc0d9d:1895:12)
http://errors.angularjs.org/1.5.3/$injector/modulerr?p0=myApp&p1=Er…2Fmodules.js%3Fhash%3Dafc491df237c732f4ec721460c9455fc18cc0d9d%3A1895%3A12)(anonymous function) # VM4605 modules.js?hash=afc491d…:232(anonymous function) # VM4605 modules.js?hash=afc491d…:4711forEach # VM4605 modules.js?hash=afc491d…:485loadModules # VM4605 modules.js?hash=afc491d…:4672createInjector # VM4605 modules.js?hash=afc491d…:4594doBootstrap # VM4605 modules.js?hash=afc491d…:1874bootstrap # VM4605 modules.js?hash=afc491d…:1895angularInit # VM4605 modules.js?hash=afc491d…:1780(anonymous function) # VM4605 modules.js?hash=afc491d…:30873fire # VM4606 jquery.js?hash=649d9f4…:3185self.fireWith # VM4606 jquery.js?hash=649d9f4…:3297jQuery.extend.ready # VM4606 jquery.js?hash=649d9f4…:3509completed # VM4606 jquery.js?hash=649d9f4…:3540
Any ideas on what might have gone wrong?
OK I swear I was searching an answer for this since yesterday. But seems like I did not Google enough before posting this question. Really sorry about that.
Anyway I found the answer myself.The required tip came from the article[angularJS]How to use angular-acl?
I changed my code as follows and everything is working fine now.
angular.module('myApp', [angularMeteor, uiRouter,'mm.acl', 'accounts.ui']);
The reason for this that(I think) the plugin Angular-ACL is defined in the angular-acl.js is as follows.
angular.module('mm.acl').provider('AclService', [
function () {
Hope this helps anyone else who's having a similar problem. Cheers!

Categories

Resources