We Keep Coding

$cookies.get is not a function - Angular JS

Designed two pages. Cookies is not set and showing error.
CDN:
<script src = "https://ajax.googleapis.com/ajax/libs/angularjs/1.6.6/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.6/angular-cookies.js"></script>
Main Page - Set Cookies / cookies is not set
var app = angular.module('myApp', ['ngCookies']);
app.controller('LoginCtrl', ['$cookies', '$scope', '$http', '$window', '$location', function($cookies,$scope, $http, $window, $location) {
$cookies.put('username', 'name');
}
Second Page - Get Cookies
var app = angular.module('myApp', [ 'ngTable', 'ngCookies' , 'ngResource']);
app.controller('AccountMappingCtrl', ['$scope', '$http','$cookies', 'NgTableParams', function($scope, $http, $filter, $cookies, NgTableParams) {
$scope.UsernameCookies = $cookies.get("username");
}
It is showing $cookies.get is not working.

try following
$scope.UsernameCookies = $cookies[username];
if will not work inject '$cookieStore' in your controller and try following:
$cookieStore.get('username')

Unit test controller, angularJS and jasmine

Hi I've been trying to unit test basic functions in my controller however I can't seem to connect when setting up the unit test.
Error: [$injector:modulerr] Failed to instantiate module myApp due to:
[$injector:nomod] Module 'myApp' is not available! You either misspelled the module name or forgot to load it. If registering a module ensure that you specify the dependencies as the second argument.
Here is my controller:
var myApp = angular.module("myApp", []);
myApp.controller('studentController', function($scope,$route,$routeParams,$http,$location){
//Get all students
$scope.getStudents = function(){
$http.get('/api/student/').then(function(response){
$scope.students = response.data;
});
};
and my test:
describe("studentController", function () {
beforeEach(module('myApp'));
var $controller;
beforeEach(inject(function (_$controller_){
$controller = _$controller_;
}))
describe("studentController", function(){
it("should get student data", function (){
var $scope = {};
$scope.getStudents();
expect($scope.students.length).toBe(15)
})
})
});
I have included both these files in the jasmine html file along with the angular-mocks.js
any help would be much appreciated

You are injecting $route, but you are not loading the ngRoute module. Load the file angular-route.js and state the dependency:
var myApp = angular.module("myApp", ['ngRoute']);

You have to create controller in before each by using following and as you are calling getStudents that shuold be mocked by using HttpBackend service in unit test.
Controller
var myApp = angular.module("myApp", []);
myApp.controller('studentController', function($scope, $route, $routeParams, $http, $location) {
//Get all students
$scope.getStudents = function() {
$http.get('/api/student/').then(function(response) {
$scope.students = response.data;
});
};
});
Test file
describe("studentController", function() {
beforeEach(module('myApp'));
var $controller, scope, route;
beforeEach(inject(function(_$controller_, $rootScope, $route, $routeParams, $http, $location) {
$controller = _$controller_;
scope = $rootScope.$new();
$controller('studentController', {
'$scope': scope,
'$route': $route,
'$routeParams': $routeParams,
'$http': $http,
'$location': $location
});
}))
describe("studentController", function() {
it("should get student data", function() {
// for this you have to use httpBackend
// you have to mock the response of api
$scope.getStudents();
// then you are able to verify the result in student
expect($scope.students.length).toBe(15)
})
})
});
For more information you can refer unit testing and Httpbackend

How to inject service from external file using AngularJS and RequireJS?

I'm injecting controller from external file and I want to do the same thing for the service from external file. It should be registered in factory statement.
Injecting of the controller working
controllers
'use strict';
define(['angular', 'services'], function (angular) {
return angular.module('vcApp.controllers', ['vcApp.services'])
.controller('AuthCtrl', ['$scope', '$injector','AuthService', function($scope, $injector, AuthService) {
require(['auth/authCtrl'], function(authCtrl) {
$injector.invoke(authCtrl, this, {'$scope': $scope, 'AuthService':AuthService});
});
}]);
});
authCtrl
define([], function() {
return ['$scope', '$routeParams', '$location', '$http', 'AuthService', function($scope, $routeParams, $location, $http, authService) {
$scope.signIn = function() {
...
}
$scope.$apply();
}];
});
And now I want to inject service
services
'use strict';
define(['angular'], function (angular) {
angular.module('vcApp.services', [])
.factory('AuthService', ['$http', '$injector', function($http, $injector) {
require(['auth/authService'], function(authService) {
$injector.invoke(authService, this, {'$http': $http});
});
}]);
});
authService
define([], function() {
return ['$http', function ($http) {
return {
login: login
};
function login(username, password) {
var request = $http(...);
return(request);
}
}]
});
When authController calls authService.login(...), it throws error Error: [$injector:undef] Provider 'AuthService' must return a value from $get factory method..
This code was inspired by angular-requirejs-seed project.

As it says, Angular's factory() is expected to return the service object. You may have luck with something like:
define(['angular'], function (angular) {
angular.module('vcApp.services', [])
.factory('AuthService', ['$http', '$injector', function($http, $injector) {
var stub = {};
require(['auth/authService'], function(authService) {
angular.extend(stub, $injector.invoke(authService, this, {'$http': $http}));
});
return stub;
}]);
});
Here you define a stub for the service and extend it, when the service is actually lazy-loaded.
(By the way I think the last 2 arguments of $injector.invoke() are redundant in this case.)
If you want another idea about mixing RequireJS and Angular, that plays well with lazy loading and the r.js optimizer, you may take a look at angular-require-lazy.

Injecting factory into service fails

I've setup an angular seed project with some services and a factory. companyService depends on a factory called company. Injecting company into companyService fails with this error. I can't seem to figure out what I'm doing wrong.
var module = angular.module('project.services', []);
module.factory('company', ['$rootScope', 'Resource', function($rootScope, $resource){
return $resource($rootScope.api + 'companies/:id');
}]);
module.service('companyService',['$rootScope', '$http', 'company', function($rootScope, $http, company){
var companies;
//var $injector = angular.injector();
//var company = $injector.get('company');
// some more functions ....
}]);

ngResource is a separate module, so you should include the angular-resource[.min].js script and declare ngResource as a dependency of your app:
angular.module('myApp', [..., 'ngResource']);

AngularJS - Uncaught Error: Service name expected from myApp

I'm trying to implement a Facebook provider (angular-facebook.js) as show in the below plnkr:
http://plnkr.co/edit/dDAmvdCibv46ULfgKCd3?p=preview
However, I've made a bit of a hash with my config files. The plnkr example doesn't use a route provider so I'm unsure how to structure my .config to both utilize the route provider and initialize my Facebook implementation:
Current but Not Working
'use strict';
var myApp = angular.module('myApp ', ['facebook'])
.config(
['FacebookProvider',
function(FacebookProvider){
var myAppId = '4605923966';
FacebookProvider.init(myAppId);
},
function($routeProvider)
{
$routeProvider.when('/admin/area',
{
templateUrl: 'app/admin/area/index.html'
});
}]
);

The method config only takes one function as a parameter, so you need to inject both FacebookProvider and $routeProvider into it like this:
'use strict';
var myApp = angular.module('myApp ', ['facebook'])
.config(['FacebookProvider', '$routeProvider',
function(FacebookProvider, $routeProvider) {
var myAppId = '4605923966';
FacebookProvider.init(myAppId);
$routeProvider.when('/admin/area', {
templateUrl: 'app/admin/area/index.html'
});
}]);