CODEWITHSUNDEEP
angularjsangular-components
dinamix
dinamix

Reputation: 661

angularjs passing variables to components through html

I currently have this component:

angular.module('myApp.viewVendor').
component('modifyOrder', {
templateUrl: 'app/view-vendor/confirm-order/modify-order.template.html',
bindings: {orderId: '<'},
controller: ['OrdersApi',
    class ModifyOrderComponent {
        constructor(OrdersApi) {
            this.OrdersApi = OrdersApi;
            this.vendorNotes = null;
            console.log(this.orderId)
        }
    }
]
});

And when I use this in my html:

<modify-order orderId={{$ctrl.orderId}}></modify-order>

I get 'undefined' printed to the console. Originally I was trying to pass it into an $mdDialog but that does not work either like so:

modifyOrder(ev) {
            this.$mdDialog.show({
                template: '<modify-order orderId="' + this.orderId + '"></modify-order>',
                parent: angular.element(document.body),
                targetEvent: ev,
                clickOutsideToClose:true
            })
                .then(function(answer) {

                }, function(error) {

                });
        }

It does not work with normal html or within the mdDialog. At this point I cannot tell if it is a mistake of syntax or something else.

Upvotes: 0

Views: 78

Answers (1)

dinamix
dinamix

Reputation: 661

This is a known bug in angular:

https://github.com/angular/material/issues/8409

Upvotes: 1

Related Questions