How to set the HTTP Header for a request using AngularJs

To set the HTTP Header for a request using AngularJs you can use the following snippet.

$http({method: 'GET', url: 'www.fesslersoftexample.com/api', headers: {
    'Authorization': 'Basic YmVlcDpib29w'}
});

Use the headers parameter in the config object you pass to $http.

For more informations see the AngularJs API Reference

Please rate this snippet

How to define global Variables in AngularJs

To define global Variables in AngularJs you can use one of the following ways.

WAY1: Using $rootScope (see this JsFiddle)

HTML:

<div ng-controller="Testfct2">
    <div ng-controller="Testfct">This Website URL is {{name}}!</div>
</div>

Javascript:

var myApp = angular.module('myFesslersoftSampleApp',[]);

function Testfct2($scope, $rootScope) {
    $rootScope.name = 'http://codesnippets.fesslersoft.de';
}

function Testfct($scope, $rootScope) {
    $scope.name = $rootScope.name;
}

WAY2: Using a Service (see this JsFiddle)

HTML:

<div ng-controller="Testfct">
  This Website URL is {{name}}!
</div>

Javascript:

var myApp = angular.module('myFesslersoftSampleApp',[]);
myApp.factory('GlobalVarsService', function() {
    return {
        name : 'http://codesnippets.fesslersoft.de'
    };
});

function Testfct($scope, GlobalVarsService) {
    $scope.name = GlobalVarsService.name;
}

The AngularFAQ is saying:

$rootScope exists, but it can be used for evil
Scopes in Angular form a hierarchy, prototypally inheriting from a root scope at the top of the tree. Usually this can be ignored, since most views have a controller, and therefore a scope, of their own.

Occasionally there are pieces of data that you want to make global to the whole app. For these, you can inject $rootScope and set values on it like any other scope. Since the scopes inherit from the root scope, these values will be available to the expressions attached to directives like ng-show just like values on your local $scope.

Of course, global state sucks and you should use $rootScope sparingly, like you would (hopefully) use with global variables in any language. In particular, don’t use it for code, only data. If you’re tempted to put a function on $rootScope, it’s almost always better to put it in a service that can be injected where it’s needed, and more easily tested.

Conversely, don’t create a service whose only purpose in life is to store and return bits of data.

FOR MORE INFORMATIONS SEE Services, $rootScope

Please rate this snippet

How to remove an element using Javascript

To remove an element using javascript, you can use one of the following snippets.

Sample Javascript

//usage document.getElementById("ElementId").remove();
Element.prototype.remove = function() {
	this.parentElement.removeChild(this);
}

Sample Javascript

//usage document.getElementsByClassName("Elements").remove();
NodeList.prototype.remove = HTMLCollection.prototype.remove = function() {
	for(var index = 0, length = this.length; index < length; index++) {
		if(this[index] && this[index].parentElement) {
			this[index].parentElement.removeChild(this[index]);
		}
	}
}

removeChild() is the only method supported by the DOM to remove a element in Javascript (see -> Mozilla MDN Node.removeChild()).

Please rate this snippet

How to remove the border of an IFrame

To Remove the Border of an IFrame you can use the snippet below.
Please note the capital B of frameBorder.

Sample HTML

<iframe src="IFRAME_URL" width="300" height="300" frameBorder="0">HERE IS A IFRAME</iframe>

if you are using HTML5 you should use the following snippet.

Sample HTML

seamless='seamless'

Please rate this snippet