ui路由器，解決，$ http不工作如記錄

Question

我有錯誤（或可能錯誤的用法？）與UI路由器，解決，工廠和$ http.get調用。

下面的代碼中配置部分片段：

$stateProvider 
    .state('index', { 
     url: '/', 
     views: { 
      '': { 
       templateUrl: './views/layout.html', 
       controller: 'MyAppCtrl' 
      }, 
      'app-navbar@index': { 
       templateUrl: './views/app-navbar.html' 
      }, 
      'app-accordion@index': { 
       templateUrl: './views/app-accordion.html', 
       controller: 'AppController', 
       resolve: { 
        appPromiseObj: function (AppFactory) { 
         return AppFactory.getApps(); 
        } 
       } 
      }, 
... 

，並具有以下AppFactory

myApp.factory('AppFactory', function ($http) { 
    var appFac = { 
     apps: [] 
    }; 

    appFac.getApps = function() { 
     promiseObj = $http 
      .get('http://localhost:4567/applications') 
      .success(function (data) { 
      console.log("success calling http"); 
      angular.copy(data, appFac.apps); 
     }); 
     return promiseObj; 
    }; 
    return appFac; 
}); 

但是當我運行應用程序，在「成功的console.log消息'回調永遠不會被執行。瀏覽器控制檯日誌顯示http調用在代碼200下執行OK。我假設這意味着角度認爲它失敗了，或者我應該做其他事情嗎？

我甚至嘗試返回$ q承諾對象（如其他有些相關的堆棧溢出線程所示），但沒有成功。在工廠代碼中，如果我使用測試數據（即沒有HTTP調用），即使我不返回承諾對象，一切正常。關於問題出在哪裏的任何指針？欣賞任何指點來幫助我調試...

Answer 1

我創建了working plunker here。問題是不正確承諾處理AppFactory.getApps()內部。我們需要在開始時返回諾言，然後返回一些成功調整的東西。現在，它的工作原理...

這是我提出的主要變化：

// INSTEAD of this 

// appFac.getApps1 = function() { 
//  promiseObj = $http.get('http://localhost:4567/applications') 
//  .success(function (data) { 
//  console.log("success calling http"); 
//  angular.copy(data, appFac.apps); 
//  }); 
//  
//  return promiseObj; 


// Let's use this 

appFac.getApps = function() { 
    return $http 
     .get('http://localhost:4567/applications') 
     .success(function (data) { 
     console.log("success calling http"); 
     angular.copy(data, appFac.apps); 
     return appFac.apps 
    }); 

    // this is already returned above 
    //return promiseObj; 

檢查它在行動here

根據您的擴​​展plunker EXTEND

（還沒有完全工作如預期）

- http://plnkr.co/edit/c89j3eFvYyguMt0QznAI?p=preview

我創建adjsuted和幹活版本

• http://plnkr.co/edit/f2aucPcbtzqwIEogbjuJ?p=preview

唯一的變化是適當的命名（例如app.js被加載爲腳本而不是script.js ...）。但最終，許現已解決，這JSON：

[{"id":10566982,"networkID":34256899,"appID":56114114 
    ,"name":"10566982name","description" 
    ... 
] 

被加載並轉換成手風琴：

• 56114114name
• 58616695name

最後回答你的問題在下面的評論中：

但promiseObj = $ http（...）...之間的區別是什麼？返回promiseObj並返回$ http（...）; ？

有沒有區別（除了我看到我的方法更清晰一點）。真正的區別在於：

angular.copy(data, appFac.apps); 

VS

return appFac.apps 

爲.success()方法的最後陳述。它必須返回一些東西。這是絕招