CODEWITHSUNDEEP
javascriptjsonangularjs
erp
erp

Reputation: 3014

Set values after creating a JSON object Angular.js

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.

Upvotes: 0

Views: 656

Answers (1)

tymeJV
tymeJV

Reputation: 104785

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;
      });
});

Upvotes: 1

Related Questions