2016-12-29 52 views
0

我正嘗試使用ui路由器將我的解析參數傳遞給角度一個組件。我UIRouter配置如下: -將解析參數傳遞給UI路由器中的angular1組件

.state(memberConstants.memberMVLicense, { 
      url: "/mvlicense", 
      template: '<member-mvlicense member-id="$resolve.memberId" members="$resolve.members"></member-mvlicense>', 
      resolve: { 
       memberId: ["$stateParams", function ($stateParams) { 
        return $stateParams.memberId; 
       }], 
       members: ["$stateParams", "$q", "factory.membersMVLicenses", 
        function ($stateParams: ng.ui.IStateParamsService, $q: ng.IQService, 
         membersMVLicensesService: data.member.IMembersMVLicensesService) { 
         var deferred = $q.defer(); 
         membersMVLicensesService.getByMemberId($stateParams["memberId"]).then((response) => { 
          // response is not null and I got some data for sure 
          deferred.resolve(response); 
         }); 
         return deferred.promise; 
       }] 
      } 
    }) 

在我的部分,我可以看到MEMBERID一邊做控制檯日誌,但成員做的console.log時總是不確定的。我很確定,在我的路線解決方案中,我沒有正確傳遞它,但我似乎無法得到它的工作。我下面的圖片,你可以看到一個console.log stamement打印數字和一個console.log打印未定義。任何幫助將是非常讚賞

module app.member { 

    class MemberMvlicenseGrid implements ng.IComponentOptions { 
     public controller: any; 
     public template: string; 
     public templateUrl: string; 
     public transclude: boolean; 
     public controllerAs: string; 
     public bindings: { [boundProperty: string]: string }; 
     constructor() { 

      this.controller = MemberMVLicenseGridController; 
      this.templateUrl = "app/member/member-mvlicense-grid.html"; 
      this.transclude = false; 
      this.controllerAs = "vm"; 
      this.bindings = { 
       "memberId": "<", 
       "members": "<" 
      }; 
     } 
    } 

class MemberMVLicenseGridController implements ng.IController { 

     public memberId: string; 
     public members: model.member.IMembersMVLicensesResult[]; 

     public $onInit(): void { 
      console.log(this.memberId);; 
      console.log(this.members); 
     } 
} 
    angular.module("app.member").component("memberMvlicenseGrid", new     MemberMvlicenseGrid()); 
} 

enter image description here

+0

這是角1或2,因爲你的代碼是這樣angular1 –

+0

這是打字稿 –

回答

1

據我可以從你的devtools截圖中看到,部分memberMvlicenseGrid不通過任何members屬性,只有memberId通過:

<member-mvlicense-grid member-id="vm.memberId" class="..."> 

由於您在其控制器中記錄了this.members,預計您會得到未定義的值。

要調整模板memberMvlicense組件是

<member-mvlicense-grid member-id="vm.memberId" members="vm.members"> 
+0

謝謝角1最有可能的,我意識到這只是一個一會兒之後,當我發佈這個問題,但接受你的答覆作爲答案,因爲你已經拿起了正確的東西 –

相關問題