CODEWITHSUNDEEP
javascripthtmlangularjs
maudulus
maudulus

Reputation: 11025

Using Angularjs ngBind with javascript object

In the following string, parsing the javascript object and placing it into an ngBinding is not evaluated it. I have a string that I am trying to include an specific part of a javascript object inside of, and am switching over to Angular for the relative ease of usage. The string at present is:

<html ng-app="bindHtmlExample">
...
<div>
    <p>"You owe ${{datatokens["DB.PMT"]}}"</p>

If I place something like "You owe ${{600+11}}" inside of the ngBinding it properly evaluates to:

"You owe me $611"

Also, when I open the console it can accurately locate datatokens["DB.PMT"]. Thus, I must be conceptually missing how to make this javascript object available to this Angular application.

Upvotes: 1

Views: 256

Answers (1)

Aditya Singh
Aditya Singh

Reputation: 16650

The {{}} binding operator in angular creates a binding from $scope to view. Any time $scope changes, the view will update based on this binding. It is the shortcut for the ng-bind directive and requires the $scope object to be present . You can use the binding operator in views for evaluating bindings and updating on change. For your case you can use the binding in view as below.

HTML:

<div ng-app='app'>
    <div ng-controller='controller'>
        <div>You owe $ {{ datatokens}} </div>
    </div>
</div>

Javascript:

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

app.controller('controller', function ($scope) {   
    $scope.datatokens = 600;
});

This will always update your binding and corresponding view element

Upvotes: 3

Related Questions