另一个函数中的函数不会在 JS 中执行

Question

In my current project, I have a function which calls an angular custom service and assign the data to a variable

var vm = this;
vm.itemname = '';

function getItems(){
  var result = myservice.getFromLibrary();
  result.then(function(data){
     vm.dataSet = data;
  });
}

I have another function to save the data and after it get saved the getItem() function should be called, as follows

vm.addItem = function(){
    var newItem = {"title": vm.itemname};
    myservice.setToLibrary(newItem);
    getItems();
};

but when the vm.addItem called, it doesn't retrieve the items in getItems function but it gives me an undefined output

Any help will be highly appreciated to fix this issue

Answer 1

First of all, I you call the function name wrong, getItem should be getItems .

If it is a typo, call the getItems method after the promise is returned from the service.

You can even add the error function from the callback.

When you use this promise(then and error) , the next lines of code executes only when the response comes from the service.

vm.addItem = function(){
    var newItem = {"title": vm.itemname};
    myservice.setToLibrary(newItem)
    .then(function(response){
        getItem();
    }
    function error(response) 
    {
     console.log('error')
    });
};

Answer 2

函数名称是getItems()但是当您从addItem调用它时，您正在调用一个未定义的函数getItem() - 您尝试调用的函数名称中缺少s 。

Answer 3

If I'm assuming right you are adding an item through service call myservice.setToLibrary(newItem); and after that reading the item present in DB through getItems(); which is again a service call ie $http POST or GET .

Reason behind the 'undefined' output

As you can see in your vm.addItem() function you are doing two $http calls to add and read.As $http is asynchronous in nature,your getItems() is executed before even your myservice.setToLibrary(newItem) is completely executed.

Due to this you are getting an undefined output.

Solution approach

Make some adjustments in your vm.addItem() function like below

vm.addItem = function(){
    var newItem = {"title": vm.itemname};
    myservice.setToLibrary(newItem).success(function(data){
        getItems();
    });

This approach will get you desired result as we made our getItems() call after the success of our setToLibrary() call.