I'm newbie in angularJS world and I probably misunderstand something.
My app use controllers, directives and services, all run perfectly untill I use a service with $resource, then there is a "conflict" or something else wrong.
Working directive :
myApp.directive('components', function(){
return function(params){
[...]
}
});
Working service :
myApp.factory('myFactory', function(){
return{
[...]
}
});
Service that cause the trouble :
angular.module('myApp', ['ngResource']).factory('resourceFactory', function($resource){
return{
[...]
}
});
There is no error in the console, the service with $resource works but the directive seems not executed.
Can you help me ?
try to define myApp in following way.
var myApp = angular.module('myApp', ['ngResource']);
then define service/directive/controller on it.
myApp.controller(...)
myApp.directive(...)
myApp.factory(...)
Related
I am working on Node JS application.
In this I have to check first user is connected with internet or not. If yes then check KinectRuntime-v2.0_1409-Setup installed or not.. and further more such kind of validations are there. so I have used the following code in my entry script:
What I have Done:
broadcast.js: // entry file which we use to start app
var tempkinect = require('./controllers/tempkinect.js');
tempkinect.controller(app);
require('dns').lookup('google.com',function(err) {
if (err){
server.listen(8000, function(req, res){
open('http://localhost:8000/internetnotfound'); // internet not found page.
return false;
});
}
else{
try{
var Kinect2 = require("kinect2");
var kinect = new Kinect2();
}
catch(ex) {
server.listen(8000, function(req, res){
open('http://localhost:8000/kinectnotfound');
open('https://www.microsoft.com/en-in/download/confirmation.aspx?id=44559');
return false;
}
} //else ends here
});
tempkinect.js file: // my controller file
module.exports.controller = function(app){
app.get('/kinectnotfound',function(req,res){
var errmsg = "KinectRuntime-v2.0_1409-Setup not installed on your computer. Download will start automatically, if not then";
var link = "https://www.microsoft.com/en-in/download/confirmation.aspx?id=44559";
var click = "Click Here!"
res.render('initialerror',{errormessage:errmsg, downloadlink : link, clickhere: click, title : 'Kinect Not Found'});
});
app.get('/internetnotfound', function(req,res){
require('dns').lookup('google.com',function(err) {
if (err){
res.render('initialerror',{errormessage:'Please Connect Internet for Login.',downloadlink : '', clickhere : '', title : 'Internet Not Connected'});
}
else{
res.redirect('/restart');
}
});
});
app.get('/restart', function (req, res, next) {
process.exit(1);
});
}
I am using enclose module which compiled the node js application and creates .exe file. Now, If I run application on my local machine using command prompt:
run > node broadcast.js
then in case of internet not found app displays corresponding page.( then I connect internet manually ) after connecting internet when I refresh the page it restarts the process, which is good as per required.
BUT, when I do the same using compiled application then it is giving me error:
What Error I am getting:
So can anyone please suggest what should be modified there?
Besides this, Forever should be installed as global on the system so it is working fine on my system but not on others with the compiled app.
Looks like you already have something running at port 8000 (possibly other copy of your app). I would make sure your app port is configurable either through environment variables or command line options. Likewise make sure it can be shut down gracefully to release the port.
As for forever, there is no reason to install it globally, package it with the application and then its available at ./node_modules/.bin
I am new to AngularJS and am trying out a few things with posting and deleting content using $resource. I've got the posting working fine, but when I try to delete something that I've posted I get a 404 error.
DELETE http://localhost:3000/tasks?__v=0&_id=53c5ddcf2978af0000ccdc50&beginningDat…vacy=true&title=This+is+a+complete+task&website=http:%2F%2Fwww.hotmail.com 404 (Not Found)
I've been working on this for a few days now and I'm just not seeing what i am missing. I am using a MEAN stack. I've got mongoose, express, bodyParser, and cors as dependencies in my app.js and created my endpoints:
app.get('/tasks', api.getTask);
app.post('/tasks', api.postTask);
app.delete('/tasks/:_id', api.deleteTask);
Here is the code from my api.js which
exports.deleteTask = function(req, res){
var _id = req.params._id;
Task.remove({_id:_id}, function(err, task){
res.send(task + ' removed task successfully');
if(err){
res.send('Hey guys...he is still here.');
}
});
};
Here is my factory/service:
'use strict';
angular.module('achievementApp').factory('tasks', function($resource){
return $resource('http://localhost:3000/tasks/',{_id: '#_id'},{
get: {method:'GET', isArray: true},
add: {method:'POST'},
delete: {method: 'DELETE'}
});
});
And here is the code from the Ctrl:
$scope.taskList = tasks.get({});
$scope.removeTask = function(obj){
tasks.delete(obj);
var index = $scope.taskList.indexOf(obj);
console.log(index);
$scope.taskList.splice(index,1);
console.log('removeTask was called');
};
Any guidance on this would be greatly appreciated. I've tried just about everything I can to get it to work and have had no luck so far.
It looks like you have a mismatch between the angular code which is putting the _id in the query string and the express code which is looking for it as a route param, which looks in the path part of the URL. req.params comes from the path part before the ?. req.query comes from the query string part after the ?. It would be more conventional to use the path in terms of REST, so I suggest changing your angularjs code to have /tasks/:_id as the resource route.
Aside: Best to use relative paths in your browser JS and omit the protocol, host, and port. Otherwise your app won't work when you deploy it on the real web.
I'm pretty new to web dev and AngularJS. I'm trying to figure out how to use services and I'm following this tutorial: http://scotch.io/bar-talk/setting-up-a-mean-stack-single-page-application
How does the service connect with the controller? Is this done implicitly? I understand that you can inject the service into the controller, but how is it being done in the tutorial?
You inject your service into your controller. Like this. The reason behind services are that you want to keep your controller as 'skinny' as possible. All heavy logic/requests should be outsourced to the service.
app.service('myService', function(){
this.name = 'Tyler';
}
app.controller('myCtrl', function($scope, myService){
$scope.name = myService.name;
}
Another benefit of using a service is that you could inject that service into more than one controller. A good example is if you had a service that made a HTTP request. Instead of recreating the same code in every controller to make the request, you could simply create a service that did the request and inject that service into every controller you needed that functionality.
edit: To answer your question. You need to be sure to place the service in the controller on the same 'module'. Meaning. In your HTML you have something like this.
<body ng-app="myApp">
That's telling the whole BODY that whatever is nested inside it belongs to the 'myAPP' app. Then you usually have an app.js file that has something like this.
var app = angular.module('myApp', []);
Notice that the angular.module takes two parameters. You're telling angular to create a new app called 'myApp' (which coincides with your HTML).
Then in your controller, service, directive files you'll have something like this at the top.
var app = angular.module('myApp');
Notice this one is only taking one parameter, the name of the app. You're telling angular that instead of creating a new app, you're going and 'getting' the one you already build. You'll then stick your controllers, directives, services on this app and as long as things are on the same app, you'll be able to inject them.
Another EDIT to your comment.
In the tutorial they're doing it a little weird. They're creating new modules for every controller, service, etc. It's not bad, just different. Doing it this way confuses me so I just prefer to stick everything under one module. In the tutorial this is the line that's gluing it all together.
// public/js/app.js
angular.module('sampleApp', ['ngRoute', 'appRoutes', 'MainCtrl', 'NerdCtrl', 'NerdService', 'GeekCtrl', 'GeekService']);
They have a sampleApp then all there other modules they build are being injected into the main sample app.
a service means to be accesible from all controllers, a service is a constructor, every controller can read or write in a service, in order to use a service you must call a service in this way:
var app = angular.module('myApp', []);
app.service('sharedProperties', function() {
var stringValue = 'test string value';
var objectValue = {
data: 'test object value'
};
return {
getString: function() {
return stringValue;
},
setString: function(value) {
stringValue = value;
},
getObject: function() {
return objectValue;
}
}
});
app.controller('myController1', function($scope, sharedProperties) {
$scope.setOnController1 = function(sharedPoperties){
$scope.stringValue = sharedProperties.getString();
$scope.objectValue = sharedProperties.getObject().data;
}
});
app.controller('myController2', function($scope, sharedProperties) {
$scope.stringValue = sharedProperties.getString;
$scope.objectValue = sharedProperties.getObject();
$scope.setString = function(newValue) {
$scope.objectValue.data = newValue;
sharedProperties.setString(newValue);
//some code to set values on screen at controller1
};
});
Here is the JS FIDDLE
http://jsfiddle.net/b2fCE/228/
I need a help in sails.js framework.i am developing the website in nodejs and sails.js framework.
is there any way to call preload action in each controller.(for ex: the controller calling time load this action).each controller having different pre load action.
Please any one suggest to me.how can i create this way or any other way.
Thanks to all.
use a service:
/service/mypre.js:
exports.first = function(req,res,cb) {
// here add you code
cb();
}
in Controller:
module.exports = {
index: function(req,res) {
sails.mypre.first(req,res, function(){
// Do other things...
});
}
}
And you may add a callback to make sure, your mypre() is done completely.
I have a url, i'm trying to get id but none of it is working req.params nor req.query
app.get('/test/:uid', function testfn(req, res, next) {
debug('uid', req.params.uid); // gives :uid
debug('uid', req.query.uid); // gives undefined
});
I'm doing an ajax call like this
$(document).on('click', 'a.testlink', function(e) {
$.ajax({
type: "GET",
url: '/test/:uid',
success: function(var) {
console.log('success');
},
error: function() {
alert('Error occured');
}
});
return false;
});
I'm using
app.use(express.json());
app.use(express.urlencoded());
instead of body parser
Your code is working as expected: The ajax call specifies url: '/test/:uid' which is what puts :uid in req.params.uid.
Try sending something else: url: '/test/123' and req.params.uid will contain 123
Here is an example that will work. I will give step by step instructions from the start:
express myproject
cd myproject
npm install
Open app.js and add in the following somewhere in the file - maybe right before the line app.get('/test/:uid',test);
var test = function(req,res,next) {
// do whatever logic is needed
res.end('Displaying information for uid ' + req.params.uid);
}
app.get('/test/:uid',test);
Now, open up a new terminal, make sure you are in the myproject directory and enter:
node app.js
Now you can visit http://localhost:3000/test/45 on the local machine and you should see:
Displaying information for uid 45
If you are not accessing from your local machine make sure to change the url above to match whatever server your node app is running on.
Also, this is just a simple example. You might be better off organizing everything by placing the routes in files similar to the routes directory example setup in a new install of an express app. You can find more detailed examples of this on the web like this one and this one. Also, one of the best explanations of organizing/reusing code in Node this I have seen is in the book NodeJS in Action.