2014-01-25 241 views
4

我有嵌套的ui-views都等待來自http請求的數據。在下面的代碼中,我用超時模擬了這個。如果我設置的超時時間超過10毫秒,那麼我的plunker根本不會加載。角度ui路由器嵌套的解決方案不解決

var myapp = angular.module('myapp', ["ui.router"]) 
myapp.config(function($stateProvider, $urlRouterProvider){ 

    // For any unmatched url, send to /route1 
    $urlRouterProvider.otherwise("/route1") 
    try{ 
    $stateProvider 
    .state('contacts', { 
    templateUrl: 'contacts.html', 
    controller: function($scope, service1){ 
     $scope.title = service1.getData() 
    } 
    ,resolve:{ 
     titlePromise:function(service1){ 
     return service1.myPromise 
    }} 
    }) 
    .state('contacts.list', { 
    templateUrl: 'contacts.list.html', 
    controller: function($scope, service2){ 
     $scope.contacts = service2.getData(); 
    }, 
    resolve:{ 
     contactPromise:function(service2){return service2.myPromise} 
    } 
    }); 
    }catch(e){ 
    alert.log(e); 
    } 
}); 

該服務定義如下。

myapp.factory('service1',['$q', function($q){ 
    var title = 'Not Yet'; 
    var _promise = $q.defer(); 
    setTimeout(function(){ 

    title='My Contacts'; 
    _promise.resolve(true); 
    },100); 

    return { 
    getData:function(){return title}, 
    myPromise: _promise.promise 
    } 
}]); 

myapp.factory('service2',['$q','service1', function($q, service1){ 

    var data = []; 
    var _promise = $q.defer(); 
    setTimeout(function(){ 
    service1.myPromise.then(function(){ 
     data=[{ name: 'Alice' }, { name: 'Bob' }]; 
     _promise.resolve(true); 
    }) 
    },100); 
    return{ 
    getData:function(){return data}, 
    myPromise:_promise 
    } 
}]); 

我需要服務2等到服務1,以履行其request.The辦法,我有它設置似乎並沒有工作,返回它的數據。我做錯了什麼?如果有更好的方式來設置我的應用程序的任何建議表示讚賞。我已經修改了用戶界面視圖嵌套觀看演示plunker她:plnkr

回答