I have this app module
angular
.module('history.components.genericAddress', ['history.filters']);
.service('constantsSrv', ConstantsServiceController)
.service('addressesService', AddressesServiceController)
and another one
angular
.module('APP')
.service('constantsSrv', ConstantsServiceController)
.service('addressesService', AddressesServiceController);
in two diff files and folders, because there are two diff applications.
I have two services that I use in both modules. I want to put in separate file both services and not anymore inside of each module body. Because each module depends on diff app I don't know how what to put in the top of the new file with both services.
One has module('history.components.genericAddress') and another .module('APP').
I ask this question because I want to make a ver 1.5 angular component and to put that component in many apps. Those 2 services are important for the component.
Please someone give me an idea how to do this because I don't know how to make this service file that will work in any app without changing anything.
So my question is only about how module('what to put here') and not how to make the code for services.
Try this.
angular
.module('Service_module')
.service('service1', function(){});
use in any module like.
1. angular
.module('FirstAPP',['Service_module'])
2. angular
.module('SecondAPP',['Service_module'])
Related
I have an AngularJS app (myApp) currently used only by my own ASP.NET MVC app. The AngularJS is working well in my app. Now other MVC apps also want this as an add-on (plugin). Is this possible to do without modifying my original AngularJS app, and been too intrusive to other apps?
I thought is like this:
distribute the myApp.js to an in-house CDN to be included the BundleConfig.cs by other apps
add a <DIV data-ng-app="myApp"> in pages of other apps so that my original AngularJS can be injected.
Far too many unknowns about how your app is configured for a precise answer but any module can be dependency injected into another module.
For simplicity sake assume that you have all the templates needed to run your app converted to javascript strings and use $templateCache() to register them and all the code for your app is in one file then anyone would be able to inject your module into theirs and use whatever components you have available.
All they would need would be a script tag that points at location for your app file ... and that location could be any server, cdn or local download directory
I'm trying to clean up my Angular app a little bit and when I came to my app.js.coffee file I ran into some things I have little knowledge of because I copy/pasted it from another source and it seemed to work.
To my knowledge every controller, service, filter etc. needs a ,
angular.module('nameOfModule')
But 2 (or more) controllers can't have the same module name because then Angular outputs an error,
Error: [ng:areq] Argument 'nameOfModule' is not a function, got undefined
But it seems the module name that you give a controller such as nameOfModule can be used on multiple services,
addMovieService.js
angular.module('addMovieseat')
.factory('movieAdd',
movieSearchService.js
angular.module('addMovieseat')
.factory('MovieSearch',
So I'm starting to wonder what the module names are for.
Add dependency for your angular module and if not then put it blank like this
angular.module('nameOfModule',[])
Error is occured because you don't add dependency for your module.
But 2 (or more) controllers can't have the same module name
This assumption is incorrect! Modules almost always have more than one controllers. In fact it is the highest level in an angular app and the module, along with all other entities (controllers, services, factories) comprise of a self sustaining AngularJS app.
For using another app inside another app, you just include the module as a dependancy like this:
angular.module('secondApp', ['firstApp'])
I have AngularJS app called myApp. It has several controllers which are used in different pages (website is based on Symfony so page reloads happens sometimes). I need to execute some lines of code in every controller. how do I do that without duplicating that code?
You can use angular.service
Services
Angular services are substitutable objects that are wired together using dependency injection (DI). You can use services to organize and share code across your app.
click here for More details
I have an angular application that looks like such.
file1.js
var app = angular.module('app', ['third-party-stuff-A']
file2.js
var app = angular.module('app', ['third-party-stuff-B']
so essentially file1 and file2 represent two separate pages in my application.
I've registered all my controllers, services, and other injectables into the module app, so for example.
app.factory('thing', function ($scope) { ... });
the thing factory is available to both app in file1 and app in file2.
I've read that it's better practice to break things into modules. app in file1 and file2 should probably be their own separate module.
And to go even a step further, perhaps thing factory can go into a module MyFactories. and MyFactories would be injected into each of my apps.
But I'm not sure what the immediate benefit is of doing this.
Most applications have one main method and links to different parts of the application.
Angular apps don't have a main method. Instead modules specify how an application should be bootstrapped. advantages for creating modules are
You can package code as reusable modules. The modules can be loaded
in any order (or even in parallel) because modules delay execution.
see more at https://docs.angularjs.org/guide/module
I'm creating a structure for a hybrid app built with ionic.
We use gulp to concat and minify the files.
So far i append every controller, service and directive to my main module defined in app.js.
Each of these components is defined in its own file which are then concatenated with gulp with app.js first and everything else last.
This is the way ionic does it for their 10k loc IonicModule.
Is there any reason why i should use the angular module system for more than the main apps module (e.g. app.directives, app.controllers etc.) besides the better structure (each component in one file) which i already have with ionics approach?
I could think of two things:
Testability: as far as i know i don't have to declare a module as angular.module , i should be able to mock controller modules (e.g. myApp.controller(x...) as well
Performance: there shouldn't be a performance gain as far as i know, am i wrong about that?