Failing to understand data binding in angularjs

Question

I have a jsbin setup here http://jsbin.com/esofiq/1/edit I'm getting confused by the way I think angularjs should work, I have some json data attached to a data attribute, angularjs fetches the data and creates the view. Doesn't calling $scope.mydata within the controller set 'mydata' as the model, and shouldn't it now update the view if the data within the data attribute is changed?

Is this easier to achieve in other frameworks if this isn't appropriate for angular?

The data should be provided from within Angular, and not by "querying the DOM" with jQuery. — holographic-principle, Apr 18 '13 at 13:24
the data is being provided from within the angular controller — raphael_turtle, Apr 18 '13 at 13:47
Please read this... http://stackoverflow.com/questions/14994391/how-do-i-think-in-angularjs-if-i-have-a-jquery-background and this http://docs.angularjs.org/guide/ — holographic-principle, Apr 18 '13 at 13:50

score 0 · Answer 1 · answered Apr 18 '13 at 13:49

0

I think these two will give you the idea:

How Angular uses data

How to make AJAX calls

answered Apr 18 '13 at 13:49

Xelom

1,615
1
13
23

score 0 · Answer 2 · answered Apr 18 '13 at 14:18

0

Although this is not the usual way to do things in Angular, you can achieve what you want, adding a watch to your data

$scope.$watch(
    function () { return  $("#mydata").data("a");}, 
    function(newValue) {
        $scope.mydata = newValue;
    }, true);

Basically we are adding a change listener to your data.

Please check this plunker, where the jquery data is changed every 2 seconds, and the div reacts to this change.

answered Apr 18 '13 at 14:18

bfcamara

323
1
2
10

that doesn't work if you set the change manually via the console – raphael_turtle Apr 18 '13 at 14:45
@raphael_turtle You are right. Outside of Angular we have to use $apply. So, to work on console we have to do this: angular.element("body").scope().$apply(function() { $("#mydata").data("a")[0].name="bill"; }); – bfcamara Apr 18 '13 at 15:33

Failing to understand data binding in angularjs

2 Answers2