コンポーネント：UI-ルータの決意をコントローラに注入しないだろう、

Question

を未定義のデータは、私は、コンポーネント& UI-ルータとの決意を使用してデータをこの問題を持って約束を解決することは、コントローラ

サービスで「未定義」であり、「後」 ：

class userService { 
    constructor ($http, ConfigService, authService) { 
    this.$http = $http; 
    this.API_URL = `${ConfigService.apiBase}`; 
    this.authService = authService; 
    } 


testAuth() { 
    return this.$http.get(this.API_URL + '/test-auth') 
} 

getCollaboratores() { 
    return this.$http.get(this.API_URL + '/collaboratores').then( 
      (resolve) => { // promise resolve 
      console.log('Success',resolve.data); 
    } 
    ) 
} 

getAccount() { 
    var config = { 
    headers: { "X-Shark-CollaboratoreId" : "1"} 
    }; 
    return this.$http.get(this.API_URL + '/accounts' + '/' + 1,  config).then( 
      (resolve) => { // promise resolve 
       console.log('Success',resolve.data); 
     } 
    ) 
} 

モジュール/コンポーネント/ルーティング：

.config(($stateProvider, $urlRouterProvider) => { 
"ngInject"; 

$urlRouterProvider.otherwise('/'); 

$stateProvider 
    .state('core', { 
     redirectTo: 'dashboard', 
     url: '/core', 
     component: 'core', 
     resolve: { 
     userdata: (userService) => { 
      return userService.getCollaboratores(); 
     }, 
     accdata: (userService) => { 
      return userService.getAccount(); 
     } 
     } 

    }); 
}) 

コントローラー：

let self; 

class CoreController { 
    constructor($state,userService,authService,userdata,accdata) { 
    this.name = 'core'; 
    this.$state = $state; 
    this.userService = userService; 
    this.authService = authService; 
    this.userdata = userdata; 
    this.accdata = accdata; 
    console.log('name',this.name); 
    self = this; 
    console.log('userdata',self); 
    } 
} 

CoreController.$inject = ['$state','userService',  'authService','userdata','accdata']; 

export default CoreController; 

"HTTP" の後の約束で "解決" オブジェクトは

this.userdata = userdata; 
this.accdata = accdata; 

を呼び出すコントローラに注入した後に定義されていません！

ここで、バグはありますか？以下に

おかげでたくさん...

Answer 1

変更getCollaboratores機能は：

getCollaboratores() { 
    return this.$http.get(this.API_URL + '/collaboratores').then( 
     (resolve) => { // promise resolve 
     console.log('Success',resolve.data); 
     return resolve; 
    }); 
} 

は、他の1 getAccount（成功コールバックの戻り解決内側すなわち）と同じ操作を行います。

これが問題を解決します。

なぜなら、成功コールバックを連鎖させる理由は、第2コールバックの引数となるものを返すための第1コールバックです。サービスの成功コールバックは何も返さなかったので（jsの関数のデフォルト戻り値は未定義です）、解決された値はコントローラで使用できませんでした。

Answer 2

どのようなバージョンのangularjsを使用していますか？ data、status、headers、configとstatusText：

は1.6で、thenコールバックは現在、4つのパラメータを受け取ることに注意してください。

このシナリオでは、resolve.dataはundefinedの値になります。ドキュメント上の

詳細情報：https://docs.angularjs.org/api/ng/service/ $ HTTP

Answer 3

コンポーネントを作成し、それに解決値をバインドする必要がありますので、私は、あなたがコントローラにない、あなたの状態のコンポーネントに関連していることがわかります。

angular 
    .module('app') 
    .component('core', { 
     templateUrl: 'app/app.html', 
     controller: CoreController, 
     controllerAs: 'vm', 
     bindings: { 
      userdata: '<', 
      accdata: '<' 
     } 
    }); 

そして、あなたのコンポーネントコントローラで解決データを取得するには、この操作を行います。 `はconsole.log（「成功」、resolve.data）用の出力が何であるかを

const vm = this; 
vm.$onInit =() => { 
    console.log('userdata: ', vm.userdata); 
    console.log('accdata: ', vm.accdata); 
}