I'm wondering what's wrong with this snippet:
(my goal if send a put request to user/14/account with data to update of course)
.controller('UserAccountCtrl', ['$rootScope', '$scope', '$state', 'user','User','Restangular',
function($rootScope, $scope, $state, user, User, Restangular) {
$scope.user = Restangular.one('user',14).get().$object;
$scope.errors = null;
$scope.save = function(){
$scope.user.one('account').put();
};
}
]);
I've got a call to user/14/account but without data :(
UPDATE
this seems to work
var user = Restangular.one('user',14).one('account');
Related
hi all i using angular js i need to transfer the value from one page controller to another page controller and get that value into an a scope anybody help how to do this
code Page1.html
var app = angular.module("app", ["xeditable", "angularUtils.directives.dirPagination", "ngNotify", "ngCookies","ngRoute"]);
app.controller('Controller1', ['$scope', '$http', '$window', '$filter','$notify','$cookieStore',
function ($scope, $http, $window, $filter, $notify, $cookieStore)
{
$scope.Message="Hi welcome"
}]);
now i want to show scope message into page2 controller
var app = angular.module("app", ["xeditable", "angularUtils.directives.dirPagination", "ngNotify", "ngCookies","ngRoute"]);
app.controller('Controller2', ['$scope', '$http', '$window', '$filter','$notify','$cookieStore',
function ($scope, $http, $window, $filter, $notify, $cookieStore)
{
///here i want get that scope value
}]);
You can use $rootScope instead of $scope:
// do not forget to inject $rootScope as dependency
$rootScope.Message="Hi welcome";
But the best practice is using a service and share data and use it in any controller you want.
You should define a service and write getter/setter functions on this.
angular.module('app').service('msgService', function () {
var message;
this.setMsg = function (msg) {
message = msg;
};
this.getMsg = function () {
return message;
};
});
Now you should use the setMeg function in Controller1 and getMsg function in Controller2 after injecting the dependency like this.
app.controller('Controller1', ['$scope', '$http', '$window', '$filter','$notify','$cookieStore', 'msgService',
function ($scope, $http, $window, $filter, $notify, $cookieStore, msgService)
{
$scope.Message="Hi welcome"
msgService.setMsg($scope.Message);
}]);
app.controller('Controller2', ['$scope', '$http', '$window', '$filter','$notify','$cookieStore', 'msgService',
function ($scope, $http, $window, $filter, $notify, $cookieStore, msgService)
{
///here i want get that scope value
console.log('message from contoller 1 is : ', msgService.getMsg());
}]);
You should use services for it .
Services
app.factory('myService', function() {
var message= [];
return {
set: set,
get: get
}
function set(mes) {
message.push(mes)
}
function get() {
return message;
}
});
And in ctrl
ctrl1
$scope.message1= 'Hi';
myService.set($scope.message1);
ctrl2
var message = myService.get()
Sharing data from one controller to another using service
We can create a service to set and get the data between the controllers and then inject that service in the controller function where we want to use it.
Service :
app.service('setGetData', function() {
var data = '';
getData: function() { return data; },
setData: function(requestData) { data = requestData; }
});
Controllers :
app.controller('Controller1', ['setGetData',function(setGetData) {
// To set the data from the one controller
$scope.Message="Hi welcome";
setGetData.setData($scope.Message);
}]);
app.controller('Controller2', ['setGetData',function(setGetData) {
// To get the data from the another controller
var res = setGetData.getData();
console.log(res); // Hi welcome
}]);
Here, we can see that Controller1 is used for setting the data and Controller2 is used for getting the data. So, we can share the data from one controller to another controller like this.
Hi I am new to angularjs and I am trying to inject some factory to controller but I am facing difficulties. My factory works fine. I am able to set data in factory.
Below is my code where I inject factory.
function () {
angular.module('RoslpApp').controller('RegistrationOTPVerification', ['$scope', '$http', '$translatePartialLoader', '$translate', '$state', '$stateParams', 'SomeFactory',
function ($scope, $http, $translatePartialLoader, $translate, $state, $stateParams, CONSTANTS, SomeFactory) {
var OTP = $stateParams.pageList.OTP;
$scope.EnterOTP = "Please enter this OTP to verify the user " + OTP;
//RegistrationOTPVerification.$inject = ['SomeFactory'];
//Facing issues in above line
alert(1);
function RegistrationOTPVerification(SomeFactory) {
var vm = this;
vm.someVariable = SomeFactory.getData();
console.log(vm.someVariable); // logs your data
alert(vm.someVariable);
}
});
This is my factory code.
(function () {
'use strict';
angular
.module('RoslpApp')
.factory('SomeFactory', SomeFactory);
SomeFactory.$inject = [];
function SomeFactory() {
var someData;
var factory = {
setData: setData,
getData: getData
};
function setData(data) {
someData = data;
}
function getData() {
return someData;
}
return factory;
}
})();
I set data in some other controller with SomeFactory.setData("123")
I want to inject someFactory as below:
RegistrationOTPVerification.$inject = ['SomeFactory'];
But whenever I write this, I get error RegistrationOTPVerification is undefined. If I comment that line everything works fine but I want to get some data from factory.
My factory name is SomeFactory and I want to inject in above controller. Any help would be appreciated.
Firstly, you missed CONSTANTS in your injections.
Next, I think you are mixing two kinds of syntax for controller here. Either use anonymous function or named. Don't mix both together.
Here's how your code should look like.
function () {
angular.module('RoslpApp').controller('RegistrationOTPVerification', ['$scope', '$http', '$translatePartialLoader', '$translate', '$state', '$stateParams', 'SomeFactory',
function ($scope, $http, $translatePartialLoader, $translate, $state, $stateParams, SomeFactory) {
var vm = this;
var OTP = $stateParams.pageList.OTP;
vm.EnterOTP = "Please enter this OTP to verify the user " + OTP;
vm.someVariable = SomeFactory.getData();
console.log(vm.someVariable); // logs your data
alert(vm.someVariable);
});
You missed CONSTANTS in controller dependency list:
'$translate', '$state', '$stateParams', 'SomeFactory',
... $translate, $state, $stateParams, CONSTANTS, SomeFactory) {
So whatever you inject SomeFactory is available in controller under the name CONSTANTS and symbol SomeFactory is undefined.
I want to create a simple login, so I just created a html page with username and password. I created a controller and called a function called login and inside that I called a factory which returns a factory data, and I would create login based on that data.
Controller
myApp.controller('login', ['$scope','$rootScope', '$location', '$window', 'authenticate', '$http', '$cookieStore',function($scope, $rootScope, $location, $window, authenticate, $http, $cookieStore) {
$scope.alert = '';
$scope.login = function(){
authenticate.login($scope.login.username, $scope.login.password).then(function(response){
alert("Inside controller"+JSON.stringify(response));
});
}
}]);
My factory
myApp.factory('authenticate',['$http', '$filter', '$cookieStore', '$rootScope', '$window', '$q',
function($http, $filter, $cookieStore, $rootScope, $window, $q) {
var data = "";
var deferred = $q.defer();
return {
login: function(userName,password){
$http.post('user/serverside/authentication.php',{username: userName, password: password})
.then(function(response){
deferred.resolve(response.data);
alert("FACTORY"+JSON.stringify(response));
});
return deferred.promise;
}
}
}]);
I call the login function inside the controller on login,
The issue is when I logged in for
The first time with one data as expected first alert inside factory
executed and then the alert inside the controller is executed.
But on the second time alert inside controller executed first and the
factory alert displaying,
Doubts
Why the execution sequence change in the second time?
Is this a right way to use for login, if any better ways please
suggest?
I think the mistake its beacuse u should generate promise in every function and no in the main factory like:
myApp.factory('authenticate',['$http', '$filter', '$cookieStore', '$rootScope', '$window', '$q',
function($http, $filter, $cookieStore, $rootScope, $window, $q) {
var data = "";
return {
login: function(userName,password){
var deferred = $q.defer();
$http.post('user/serverside/authentication.php',{username: userName, password: password})
.then(function(response){
deferred.resolve(response.data);
alert("FACTORY"+JSON.stringify(response));
});
return deferred.promise;
}
}
}]);
Ur code not works because promise its generated first time executed and when code checked if promise its resolve automatically execute then block.
2.- You can use ssl to securize your login, but the function login its similar. The important its implementation its on server side.
I need to build a url using info from different controllers. inside my post controller I get the posts data from this:
Post Controller:
Data.get('posts').then(function(data){
$scope.posts = data.data;
});
in the same controller I am getting site wide configs
configFactory.getconfigs().then(function(data){
$rootScope.configs = data;
});
below that I am building a url
$scope.twitterUrl = "http://www.twitter.com?p1=$scope.posts.p1&p2=$rootScope.configs.p2&p3=$rootScope.configs.p3";
to put it all together:
app.controller('postsCtrl', function ($scope, $log, $http, $timeout, Data, Auth, TrackClicksFactory, $uibModal, $filter, $rootScope, configFactory, siteMsgFactory, $confirm) {
Data.get('posts').then(function(data){
$scope.posts = data.data;
});
configFactory.getconfigs().then(function(data){
$rootScope.configs = data;
});
$scope.twitterUrl = "http://www.twitter.com?p1=$scope.posts.p1&p2=$rootScope.configs.p2&p3=$rootScope.configs.p3";
}
I am trying to get the data from both the $scope.posts and $rootScope.configs to build out my url.
I am sure this is easy but I have hit a wall. any help is much appreciated
I'm setting a rootScope variable to maintain the state of the program. This works, but I don't think it's quite 'right'. Is there a better way to select an object from an array?
Here's my current code.
angular.module('myApp.controllers', [])
.controller('packingCtrl', ['$scope', '$http', '$filter', '$rootScope', function($scope, $http, $filter, $rootScope) {
$http.get('data/trayData.json').success(function(data) {
$scope.trays = data;
});
var currentOrder = $rootScope.currentlyPacking;;
$http.get('data/orderData.json').success(function(data) {
$scope.orders = data;
$scope.current = $filter('filter')($scope.orders, {orderId: currentOrder});
});
}])
Thanks in advance for any insight / best practices.
You can create a service to hold your state. Each service instance is a singleton, so when the service is injected into various controllers, all will see the same state.
var currentlyPackingSvc = function($http) {
var currentlyPacking = {
}
return {
currentlyPacking: currentlyPacking,
getTrays: function() { /* make $http call and update currentlyPacking */ },
getOrders: function() { /* make $http call and update currentlyPacking */ }
}
}
angular.service('currentlyPackingSvc', ['$http', currentlyPackingSvc]);
angular.controller('packingCtrl', ['$scope', '$http', '$filter', '$rootScope', 'currentlyPackingSvc'
function($scope, $http, $filter, $rootScope, currentlyPackingSvc) {
...
var currentOrder = currentlyPackingSvc.currentlyPacking;
...
}]);
Assuming you leave your 'currentlyPacking' property as an object, the changes should automatically be pushed to your scope.
This way, you have all your state isolated to one service that can be utilized anywhere.