0

I am trying to pass my resolve parameters to angular one component using ui router. My UIRouter configuration is as below :-

.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;
                }]
            }
  })

In my component i can see memberId while doing console log but members is always undefined when doing console.log. I am pretty sure that in my route resolve I am not passing it properly but I can't seems to get it work. I an image below as you can see one console.log stamement priniting the number and one console.log printing undefined. Any help will be really appreciated

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

2
  • This is Angular 1 or 2, Because your code is like angular1 Commented Dec 29, 2016 at 10:36
  • this is angular 1 with typescript Commented Dec 29, 2016 at 11:35

1 Answer 1

1

As far as I can see from your devtools screenshot, component memberMvlicenseGrid is not passed any members attribute, only memberId passed:

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

As you log this.members in its controller, it's expected you get undefined.

Most likely you want to adjust template for memberMvlicense component to be

<member-mvlicense-grid member-id="vm.memberId" members="vm.members">
Sign up to request clarification or add additional context in comments.

1 Comment

thanks, i realised it just a moment later when I posted the question but going to accept ur reply as an answer as you have picked up the right thing

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.