python ruby-programming-language Smalltalk Vue.js Knockoutjs TypeScript JavaScript, OOPs JavaScript Angular 8,7,6,5,4 and 2 Interview Questions and Answers Angular 8,7,6,5,4 and 2 Interview Questions and Answers Angular 4 Angular 2 AngularJs 1.x NodeJs Perl Programming R Programming RequireJs Rust Programming Backbonejs closure programming language go-programming-language kotlin-programming-language
constant and value angular

What are constant and value in angularjs?

Hello everyone, I am going to share to constant vs.value in angular, This is the most important part of angular and the best practice to use constants and value in angular apps.

The angular support to global constant and value, using the constant and value you can configure your constants and its values. The values can be injected and can't injected as per you requirement. When you want to inject your values that time use angular value and otherwise use to angular constant.

The constant value never change and access the value from anywhere and anytime in the apps.

The value and constant  both are same but the value of values can be change anywhere and anytime in the apps. This is the main difference over the constant and value in angular.

Example over angular value

Example 1. storing the single value as given below

// storing a single value
var app = angular.module("valueApp", []);

app.value("userId", 0);

//Here inject our constant value into a value controller.
app.controller("valueCtrl", function (userId) {
    console.log(userId);
    userId = 10;
    console.log(userId);
});

Example 2. storing the multiple value inside the objet as given below

// Storing multiple values inside of an object
var app = angular.module("valueApp", []);


app.value("userConfig", { userName: "",  userEmail: "",  userContact: "" });

// Now we inject our constant value into a value controller
// Values will be empty

app.controller("valueCtrl",function (userConfig) {
    console.log(userConfig);
    console.log("Name: ", userConfig.userName);
    console.log("EmailId: ", userConfig.userEmail);
    console.log("Contact: ", userConfig.userContact);
});

Example 3. storing the multiple value inside the objet as given below

// Storing multiple values inside of an object
var app = angular.module("valueApp", []);


app.value("userConfig", { userName: "",  userEmail: "",  userContact: "" });

// Now we inject our constant value into a value controller
// Values will be populated inside of controller
app.controller("valueCtrl", function (userConfig) {

    // Values will be populated.
    userConfig.userName = "Anil Singh";
    userConfig.userEmail = "[email protected]";
    userConfig.userContact = "+91-9015519999";

    console.log(userConfig);
    console.log("Name: ", userConfig.userName);
    console.log("EmailId: ", userConfig.userEmail);
    console.log("Contact: ", userConfig.userContact);
});


Example over the angular constant

Example 1. storing the single constant  as given below

// Storing a single constant value.
var app = angular.module("constantApp", []);

app.constant("contName", "My App");

// Now we inject our constant value into a constant controller.
app.controller("constantCtrl", function (contName) {
    console.log(contName);
});

Example 2. storing the multiple constant  as given below

// Storing multiple constant values inside of an object.
var app = angular.module("constantApp", []);

app.constant("appConfig", {
        appName: 'code-sample',
        appVersion: 'v1.10',
        appURL: 'http://www.code-sample.com/'
   });

// Now we inject our constant value into a constant controller
app.controller("constantCtrl", function (appConfig) {

    console.log(appConfig);
    console.log("App Name", appConfig.appName);
    console.log("App Version", appConfig.appVersion);
    console.log("App URL", appConfig.appURL);
});


Summary Table as give below
  1. All the provider are instantiate only one time that means all are singletons.
  2. All the provide can be decorated constant can be decorated.
  3. The constant values can be inject any-time and any-where that value never changed.
  4. A angular value is an injectable value.
  5. A angular service is an injectable constructor.
  6. A angular factory  is an injectable function.


Please send me a valuable feedback about this.... Thank you very much!!

ANIL SINGH

Hi there! Welcome to my blog. My name is Anil Singh. I'm a author of this blog. For more detail about me, kindly refer to this link..
My Blogs - http://code-sample.com and http://code-sample.xyz
My Books - Interview Questions and Answers Books- Get Your Book in 15+ Digital Stores Worldwide..

You Might Also Like
www.code-sample.com/. Powered by Blogger.
ASK Questions