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

Question

在我当前的项目中，我有一个函数调用 angular 自定义服务并将数据分配给变量

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

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

我有另一个函数来保存数据，保存后应该调用 getItem() 函数，如下所示

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

但是当 vm.addItem 调用时，它不会检索 getItems 函数中的项目，但它给了我一个未定义的输出

任何帮助将不胜感激解决此问题

Answer 1

首先，我你调用的函数名错了， getItem应该是getItems 。

如果是拼写错误，请在服务返回承诺后调用 getItems 方法。

您甚至可以从回调中添加错误函数。

当您使用此promise(then and error) ，仅当响应来自服务时才会执行下一行代码。

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

如果我假设正确，您正在通过服务调用myservice.setToLibrary(newItem);添加一个项目myservice.setToLibrary(newItem); 然后通过getItems();读取 DB 中存在的项目getItems(); 这又是一个服务调用，即$http POST or GET 。

“未定义”输出背后的原因

正如您在vm.addItem()函数中看到的，您正在执行两个$http调用来添加和读取。由于$http本质上是异步的，您的getItems()甚至在您的myservice.setToLibrary(newItem)完全执行之前就已执行.

因此，您将获得未定义的输出。

解决方法

在vm.addItem()函数中进行一些调整，如下所示

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

当我们在setToLibrary()调用成功后进行getItems()调用时，这种方法将获得您想要的结果。