Angular-Toaster not working in my service? - javascript

I have got to know toaster.js from this site and trying to implement it in my web app. I have done it according to the example but it doesn't work.
Here is my service where I Implemented:
function () {
angular
.module('FoursquareApp')
.factory('DataService', DataService);
DataService.$inject = ['$http','toaster'];
function DataService($http, toaster) {
.id,
venueName: venue.name,var serviceBase = '/api/places/';
var placesDataFactory = {};
var userInContext = null;
var _getUserInCtx = function () {
return userInContext;
};
var _setUserInCtx = function (userInCtx) {
userInContext = userInCtx;
};
var _savePlace = function (venue) {
//process venue to take needed properties
var minVenue = {
userName: userInContext,
venueID: venue
address: venue.location.address,
category: venue.categories[0].shortName,
rating: venue.rating
};
return $http.post(serviceBase, minVenue).then(
function (results) {
toaster.pop('success', "Bookmarked Successfully", "Place saved to your bookmark!");
},
function (results) {
if (results.status == 304) {
toaster.pop('note', "Faield to Bookmark", "Something went wrong while saving :-(");
}
else {
toaster.pop('error', "Failed to Bookmark", "Something went wrong while saving :-(");
}
return results;
});
};
I have called the library scripts in index.html and also the css files.
Any ideas of what I might be doing wrong?

Are you sure that you use toaster.js library? The popular one is toastr.js
Try to modify your code to
DataService.$inject = ['$http','toastr'];
function DataService($http, toastr) {
...
Also ensure, that you link this js file in you index.html and also refer this package in main app module definition as a second (dependency) parameter

Related

how to do nativescript paytm integration

i have checked the native-script-paytm integration plugin. but both git-hub repository are not running instead it gives stack exception. so i created my own project and some how its doing something. but here i have lot of questions on how to get 'mid', 'order id' etc.
can anyone give step by step details for this.
const createViewModel = require("./main-view-model").createViewModel;
const Paytm = require("#nstudio/nativescript-paytm").Paytm;
const paytm = new Paytm();
exports.pageLoaded = function (args) {
const page = args.object;
page.bindingContext = createViewModel();
}
exports.onPayWithPaytm = function (args) {
console.log("Paying");
paytm.setIOSCallbacks({
didFinishedResponse: function (response) {
console.log("got response");
console.log(response);
},
didCancelTransaction: function () {
console.log("User cancelled transaction");
},
errorMissingParameterError: function (error) {
console.log(error);
}
});
const order = {
// This will fail saying duplicate order id
// generate your own order to test this.
MID: "Tomcas09769922377481",
ORDER_ID: "ORDER8874",
CUST_ID: "CUST6483",
INDUSTRY_TYPE_ID: "Retail",
CHANNEL_ID: "WAP",
TXN_AMOUNT: "10.00",
WEBSITE: "APP_STAGING",
CALLBACK_URL: "https://pguat.paytm.com/paytmchecksum/paytmCallback.jsp",
CHECKSUMHASH:
"NDspZhvSHbq44K3A9Y4daf9En3l2Ndu9fmOdLG+bIwugQ6682Q3JiNprqmhiWAgGUnNcxta3LT2Vtk3EPwDww8o87A8tyn7/jAS2UAS9m+c="
};
paytm.createOrder(order);
paytm.initialize("STAGING");
paytm.startPaymentTransaction({
someUIErrorOccurred: function (inErrorMessage) {
console.log(inErrorMessage);
},
onTransactionResponse: function (inResponse) {
console.log(inResponse);
},
networkNotAvailable: function () {
console.log("Network not available");
},
clientAuthenticationFailed: function (inErrorMessage) {
console.log(inErrorMessage);
},
onErrorLoadingWebPage: function (
iniErrorCode,
inErrorMessage,
inFailingUrl
) {
console.log(iniErrorCode, inErrorMessage, inFailingUrl);
},
onBackPressedCancelTransaction: function () {
console.log("User cancelled transaction by pressing back button");
},
onTransactionCancel: function (inErrorMessage, inResponse) {
console.log(inErrorMessage, inResponse);
}
});
}
For reference
As mentioned in the plugin's ReadMe file,
You will need a working backend server to generate paytm orders. Do not generate the order or checksum in the app.

$save gives me TypeError: undefined is not a function when saving model that is a list in angular

I am using current versions of asp.net, mvc, rest api, and angular.js. I populate my page with a list then on $save it gives me error TypeError: undefined is not a function
$scope.scacTaskPLDetails = {};
$scope.onGetTaskList = function () {
var scacTaskRes = $resource("api/ScacTaskPLDetails");
scacTaskRes.query({ taskID: scacTaskID }, function (scacTaskPL) {
$scope.scacTaskPLDetails = scacTaskPL;
});
}
/************************ Save Task **************************/
$scope.onSaveScacTask = function () {
if (!$scope.isEditing) {
$scope.$broadcast('show-errors-event');
if ($scope.TaskForm.$invalid) { return; }
$scope.$broadcast('show-errors-event');
if ($scope.TaskForm.$invalid) { return; }
}
$scope.scacTaskPLDetails.$save(function (results) {
if (results.successful) {
Notifications.success(results.serverMessage);
$scope.onReloadPage();
}
else {
Notifications.error(results.serverMessage);
}
});
}
I hope this is enough information. I have had no trouble up until now and the only thing different is that I am saving a list instead of a single object. In debugging I can see the list of objects populating the viewmodel scacTaskPLDetails.
you should use your resource to send an action to your endopint, not the response you got from the resource
try something like
var scacTaskRes = $resource("api/ScacTaskPLDetails");
$scope.scacTaskRes.$save(function (results) {
if (results.successful) {
Notifications.success(results.serverMessage);
$scope.onReloadPage();
}
else {
Notifications.error(results.serverMessage);
}
});
Thanks for the tips. I finally got it to save my collections with isArray: true
app.factory("SaveArrayOfTaskPLObjects", ['$resource', function ($resource) {
return $resource(
"api/ScacTaskPLDetails",
{},
{
save: {
method: 'POST',
isArray: true
}
}
);
}]);

AngularJS tutorial Thinkster.io chapter 7

UPDATE: The tutorial was updated and the following question really no longer applies
Learning about AngularJS from the site thinkster.io (free ebook). But at the moment i'm stuck at chapter 7 - Creating your own user data using firebase. This is an tutorial about angularjs that works with firebase.
I have wrote all the code according to the site, but i'm getting these console errors when I want to register a user. It will create the user (in firebase -simplelogin), but not the user object (in firebase - data).:
TypeError: undefined is not a function
at Object.User.create (http://localhost:9000/scripts/services/user.js:46:19)
at http://localhost:9000/scripts/controllers/auth.js:32:22
etc.
This is the code (same as the site), the error is in the create() function and talks about the users.$save() function, snippet of User.create():
users.$save(username).then(function () {
setCurrentUser(username);
});
Complete code of user.js:
news.factory("User", function ($firebase, FIREBASE_URL, $rootScope, $log) {
var reference, users, User;
reference = new Firebase(FIREBASE_URL + "users");
users = $firebase(reference);
function setCurrentUser(username) {
$rootScope.currentUser = User.findByUsername(username);
}
$rootScope.$on("$firebaseSimpleLogin:login", function (event, authUser) {
var query = $firebase(reference.startAt(authUser.uid).endAt(authUser.uid));
query.$on("loaded", function () {
setCurrentUser(query.$getIndex()[0]);
});
});
$rootScope.$on("$firebaseSimpleLogin:logout", function () {
delete $rootScope.currentUser;
});
User = {
create: function (authUser, username) {
users[username] = {
md5_hash: authUser.md5_hash,
username: username,
"$priority": authUser.uid
};
$log.debug(users);
users.$save(username).then(function () {
setCurrentUser(username);
});
},
findByUsername: function (username) {
if (username) {
return users.$child(username);
}
},
getCurrent: function () {
return $rootScope.currentUser;
},
signedIn: function () {
return $rootScope.currentUser !== undefined;
}
};
return User;
});
Edit 1:
Registering a user now works, got it working (saving in firebase, simple login and data):
users = $firebase(reference).$asObject();
Notice the users.save() function:
create: function (authUser, username) {
users[username] = {
md5_hash: authUser.md5_hash,
username: username,
$priority: authUser.uid
};
$log.debug(users);
users.$save().then(function () {
setCurrentUser(users);
});
},
findByUsername: function (users) {
if (users) {
return users;
}
},
Edit 2:
Now I get an error at the log in of the user (see below), when I want to log in, I get an error on this this function, query.$on():
TypeError: undefined is not a function
at http://localhost:9000/scripts/services/user.js:26:19
$rootScope.$on("$firebaseSimpleLogin:login", function (event, authUser) {
var query = $firebase(reference.startAt(authUser.uid).endAt(authUser.uid));
query.$on("loaded", function () {
setCurrentUser(query.$getIndex()[0]);
});
});
What is wrong now?
This is an answer on edit 2: I have used firebase(ref), query.$loaded and searched for the right object, that's it. Maybe someone have an different answer, please post them :).
I have finally completed chapter 07!
In general (solution for Edit 2):
$rootScope.$on("$firebaseSimpleLogin:login", function (event, authUser) {
var query = $firebase(reference).$asObject();
query.$loaded(function (result) {
angular.forEach(result, function (key) {
if (key.md5_hash === authUser.md5_hash) {
setCurrentUser(key);
}
});
});
});
This is not the ideal solution, but the free ebook (atm of writing) is far from ideal. Then again, these kind of situations helps you to understand a little bit more about the firebase api and how it works with angular. But can be frustrated at times, when you just want to go through the tutorial ;).
Note! I have saved the User object and pass the User object to the findUsername() and setCurrentUser() functions instead of just the user.username.
You can also use the native array function, like some().
I think your system uses the newer version of Angularfire (version>= 0.8). Which means for running through loops that are arrays ...you need to attach .$asArray() at the end of the user definition field. Check the updates of Firebase.

Angular js redirecting from log in page to Dashboard along with json data

I am trying to build a simple app using Angular JS. Here I have two html files (Login.html & Dashboard.html). when I run the Login.html it works well And on the successful log in I need to show the user dashboard with the json data populated(from server) at Login time.
here is my code: (main.js)
var app = angular.module('NovaSchedular', []);
app.factory('MyService', function()
{
var savedData = {}
function set(data)
{
savedData = data;
}
function get()
{
return savedData;
}
return {
set: set,
get: get
}
});
function LoginController($scope,$http,MyService,$location)
{
$scope.login = function(str) {
console.log(".......... login called......");
var validEmail=validateEmail(email.value);
if(validEmail && password.value != ""){
$http.post('./nova/TaskManager/public/user/login?email='+email.value+'&password='+password.value).success(function(data, status)
{
console.log(data);
var result=data.response;
console.log(result);
if (result=="success")
{
$scope.userId=data.user_id;
$scope.email=data.email;
$scope.Name=data.name;
$scope.password=data.password;
$scope.Type=data.type;
console.log("........"+$scope.userId);
console.log("........"+$scope.email);
console.log("........"+$scope.Name);
console.log("........"+$scope.password);
console.log("........"+$scope.Type);
MyService.set(data);
console.log(data);
alert(data.message);
window.location.href='./Dashboard.html';
//$location.path('./Dashboard.html', data);
}
else
alert(data.message);
});
}
}
}
function DashboardController($scope,$http,MyService)
{
$scope.userInfo = MyService.get();
}
here after LOGIN successfully, I am getting the server response (json data) under the LoginController well. Now, further I need these data to be available on the Dashboard page so that dashboard would populate with the respective user data.
I am trying this by using:
window.location.href='./Dashboard.html';
//$location.path('./Dashboard.html', data);
but it didn't work for me. It's redirecting to the Dashboard.html well, but doesn't containing the data what I need to pass from the LoginController to the DashboardController. so, that it would available for the Dashboard.html page.
while seeing at the console for the Dashboard.html, it's empty json is showing there.
Don't know what's missing. why it's not passing the data.
Any suggestion would be appreciated.
try this controller code :
app.controller('LoginController' function($scope,$http,MyService,$location)
{
$scope.login = function(credential) {
console.log(".......... login called......");
var validEmail=validateEmail(credential.email);
if(validEmail && credential.password!= ""){
MyService.login(credential);
}
}
});
and this:
app.controller('DashboardController',function($scope,$http,MyService)
{
$scope.userInfo = MyService.getDashboardData();
});
MyService.js:
var app = angular.module('NovaSchedular', []);
app.factory('MyService', function()
{
var dashboardData;
var obj={
login:function(credential){
$http.post('./nova/TaskManager/public/user/login?email='+credential.email+'&password='+credential.password).success(function(data, status, headers) {
dashboardData=data;
window.location.href='./Dashboard.html';
})
.error(function(data, status, headers, config) {
console.error('error in loading');
});
},
getDashboardData:function(){
return dashboardData;
}
}
return {
login:obj.login,
getDashboardData:obj.getDashboardData
}
});

Load default data

I just started building an app using the Ionic Framework. But it basically uses Angular.js so the question should be easy to answer :)
The challenge: I have a list of dummy contacts which I can get from a ContactService. Now I'd like to get the actual contacts of my phone. The problem is, that I have to wait for the app to load before I can access the contacts. So I have to wrap it inside an event listener. This is my code, how can I make it work (the success function gets an array of contacts, I checked that)?
document.addEventListener('deviceready', function() {
StatusBar.styleDefault();
function onSuccess(contacts) {
ContactService.add(contacts);
};
function onError(contactError) {
alert('onError!');
};
var options = new ContactFindOptions();
options.multiple = true;
var fields = ['displayName', 'name'];
navigator.contacts.find(fields, onSuccess, onError, options);
}, false);
angular.module('starter.services', [])
.factory('ContactService', function() {
var contacts = [];
return {
add: function(result) {
contacts = result;
},
all: function() {
return contacts;
},
get: function(contactId) {
return contacts[contactId];
},
count: function() {
return contacts.length;
}
}
});

Categories

Resources