javascript - Getting data from angular factory using BreezeJs -

i'm working on implementing angular factory project i'm working on.

i've gotten routing working: artlogmain.js

var artlog = angular.module('artlog', ['nggrid', 'ui.bootstrap']);  artlog.config(function ($locationprovider, $routeprovider) {     $locationprovider.html5mode(true);      $routeprovider.when("/artlog", {         controller: "artlogctrl",         templateurl: "/templates/artlog/index.html"     });      $routeprovider.when("/artlog/:id", {         controller: "artlogeditctrl",         templateurl: "/templates/artlog/edit.html"     });      $routeprovider.when("/artlog/dashboard", {         controller: "artlogdashboardctrl",         templateurl: "/templates/artlog/dashboard.html"     });      $routeprovider.otherwise("/"); }); 

next setup factory: artlogdataservice

artlog.factory("artlogdataservice", function ($q) {     breeze.config.initializeadapterinstance("modellibrary", "backingstore", true);      var _artlogview = [];     var _artlogsingle = [];      var _getartlogbyid = function (id) {          var deferred = $q.defer();          var manager = new breeze.entitymanager('breeze/breezedata');         var query = new breeze.entityquery().from('project').where("id", "equals", id);          manager.executequery(query).then(function (data) {             angular.copy(data, _artlogsingle);             deferred.resolve();         }).fail(function () {             deferred.reject();         });          return deferred.promise;     };      var _getartlogview = function () {          var deferred = $q.defer();          var manager = new breeze.entitymanager('breeze/breezedata');         var query = new breeze.entityquery().from('artlogview');          manager.executequery(query).then(function (data) {             //angular.copy(data.results, _artlogview);             _artlogview = data.results;             deferred.resolve();         }).fail(function () {             deferred.reject();         });          return deferred.promise;     };      return {         artlogview: _artlogview,         artlogsingle: _artlogsingle,         getartlogview: _getartlogview,         getartlogbyid: _getartlogbyid     }; }) 

the controller: artlogcontroller.js

function artlogctrl($scope, artlogdataservice) {     $scope.artlogdata = artlogdataservice;     $scope.editableinpopup = '<button id="editbtn" type="button" class="btn btn-primary" ng-click="edit(row)" >edit</button>';      artlogdataservice.getartlogview();      $scope.edit = function (row) {         window.location.href = '/artlog/' + row.entity.id;     };      $scope.gridoptions = {         data: artlogdataservice.artlogview,         showgrouppanel: true,         enablepinning: true,         showfilter: true,         multiselect: false,         columndefs: [             { displayname: 'edit', celltemplate: $scope.editableinpopup, width: 80, pinned: true, groupable: false, sortable: false },             { field: 'artnum', displayname: 'art number', resizable: true, pinned: true, groupable: false, width: '100px' },             { field: 'createdate', displayname: 'date created', cellfilter: "date:'mm-dd-yyyy'", pinnable: false, width: '110px' },             { field: 'artcompletiondue', displayname: 'art comp due date', cellfilter: "date:'mm-dd-yyyy'", pinnable: false, width: '160px', enablecelledit: true },             { field: 'daysleft', displayname: 'days left', pinnable: false, width: '90px' },             { field: 'revisionnum', displayname: 'rev number', pinnable: false, width: '100px' },             { field: 'status', displayname: 'status', pinnable: false, width: '80px' },             { field: 'template', displayname: 'template', pinnable: false, width: '190px' },             { field: 'driver', displayname: 'driver', pinnable: false, width: '160px' },             { field: 'assignedto', displayname: 'assigned to', pinnable: false, width: '160px' },             { field: 'buddyartist', displayname: 'buddy artist', pinnable: false, width: '160px' }         ],         filteroptions: {             filtertext: "",             useexternalfilter: false         }     }; } 

i set breakpoint on artlogdataservice.getartlogdata , see call fire. see query run , data returned, when @ artlogdataservice object returned factory shows array[0]. data never seems bind artlogview.

what doing wrong?

thanks!

the problem network callback breeze not part of angular update loop. angular doesn't know data changed, watcher on view binding never gets updated.

you need wire in $scope.$apply() call when data comes back. cause bindings notice change in data , update.

perhaps this:

artlogdataservice.getartlogview().then(function() {     $scope.$apply(); }); 

if within angular, never need call $scope.$apply, because can mutate data (events, network responses, timeouts, etc) handled angular (via $http , $timeout, etc) , $apply automatically called. in these situations data gets changed event outside of angular $scope.$apply necessary.

hope you!