Set values after creating a JSON object Angular.js

Question

I am having some trouble setting some values for a widget I am making. I am using Ozone widget framework, but that part is negligible to this discussion. Here us the html where I am trying to set the variable (for now just focus on {{user.user}} part.

<div class="col-lg-12">
    <p>User: {{user.user}}</p>
    <table class="table table-bordered table-hover table-striped">
        <thead>
            <th>#</th>
            <th>Model</th>
            <th>Score</th>
            <th>Date</th>
        </thead>
        <tr data-ng-repeat=" item in records | orderBy : '-score' | limitTo : 10 " ng-click="">
            <td>{{$index+1}}</td>
            <td>{{item.model}}</td>
            <td>{{item.score}}</td>
            <td>{{item.date}}</td>
        </tr>
    </table>
</div>

And here is the Angular / owf to go with it:

angular.module('myapp', ['cgOwf'])
  .controller('MainCtrl', function($scope, $http, owf) {
    var records;
    $scope.selectPost = '';
    $scope.searchText = ''; 
    console.debug("before IT HERE!!!");
   owf.ready(function(){
       console.debug("MADE IT HERE!!!");
      owf.Eventing.subscribe('user-status', function(sender, msg, channel) {
          console.debug('[%s] - received message %o', channel, msg);
          $scope.user = msg;
      });
   });

    $scope.search = function() {
      //clear the select, go here http://jsonplaceholder.typicode.com/comments
      //and display/filter emails based on the search input
      $scope.selectPost = "";
      $scope.selectedItem = null;
      $http.get('https://api.myjson.com/bins/1jvst').success(function(data2) {
        $scope.records = [];
        data2.forEach(function(r) {
          if (r && r.user && r.user.toLowerCase().indexOf($scope.searchText.toLowerCase()) !== -1) {
            $scope.records.push(r);
          }
        });
      });
    };

  });

The part I am having trouble with is $scope.user = msg;. At that point in the code, msg is a JSON object, and I am sure of that because it checks out in the js debugger in chrome. AFAIK that is how I would set the object so I could access it in the html, though something clearly doesn't work.

Is that owf event triggering a $digest cycle? Try $scope.$apply() after setting the value.; — tymeJV
– tymeJV, Commented Apr 27, 2015 at 22:19
Is your controller associated to the view ok? Do you get anything if you just do {{user}} ? — Asta
– Asta, Commented Apr 27, 2015 at 22:39
@tymeJV I think that may have actually been the solution. The cache on chrome just sux so since I didn't clear it the old info was there. — erp
– erp, Commented Apr 27, 2015 at 22:54
@erp -- Gotta love cache issues... In chrome, you can set the cache to clear as long as the consoles open, as well as, if the consoles open you can right click the refresh button -> empty cache and hard reload. — tymeJV
– tymeJV, Commented Apr 28, 2015 at 1:00

tymeJV · Accepted Answer · 2015-04-28 14:02:27Z

1

The owf event probably isn't triggering a $digest cycle, so the view never updates. You can run $scope.apply() to force a $digest

owf.Eventing.subscribe('user-status', function(sender, msg, channel) {
      console.debug('[%s] - received message %o', channel, msg);
      $scope.$apply(function() {
          $scope.user = msg;
      });
});

answered Apr 28, 2015 at 14:02

tymeJV

105k14 gold badges165 silver badges158 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Set values after creating a JSON object Angular.js

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related