Data not updating in AngularJS

Question

Data not updating in AngularJS

I am working on a web app in Ionic. Here, I have a button in menu.html, which when clicked should cause a function in controllers.js to add newData to "data" in the appApi.js file but I am getting an error. Can someone take a look? Here's the code in menu.html and controllers.html: http://pastebin.com/GW0h2G3P and here is appApi.js: http://pastebin.com/jbqqUbCP

Thanks!

angularjs
ionic-framework

Answer 1

In your appapi service

var addData = function(newData) {
    data[data.length] = newData;
}

return {
    getData: getData
};

addData is private. It's not exposed.

In your controller: You are trying to access that addData which is not available.

 $scope.add = function() {
        appApi.addData($scope.newData);
    }

To fix it: add addData to your return object in service

var addData = function(newData) { data[data.length] = newData; }

return {
    getData: getData,
    addData  : addData
};

Answer 2

I wonder how you forgot to add adddata to your return object.

Your factory should look like this,

testApp.factory('appApi', function() {

    var data = [{
        "fName": "Starbucks",
        "id": 1,
    }];

    var getData = function() {
        return data;
    }

    var addData = function(newData) {
        data[data.length] = newData;
    }

    return {
        getData: getData,
          addData  : addData
    };

});

Here is the working Plnker