Im trying to pass some parameters to my component through bindings, but unfortunately I'm not having luck in using those params in my controller, this is my code:
angular.module('project1').component('menu', {
templateUrl: '/static/js/templates/menu.template.html',
bindings: {
rid: '@'
},
controller: ['Restaurant', function RestaurantListController(Restaurant) {
console.log(this.rid);
console.log(this);
this.restaurant = Restaurant.get({restaurantId: this.rid});
}]
});
HTML component:
<menu rid="1"></menu>
The interesting thing is that i can access the parameters in the template and when i do the 2 console log, the first one is undefined, but in the second one i can see the rid variable...so, i really don't understand what i'm missing.
Nested Controllers: AngularJS allows using nested controllers. It means that you have specified a controller in an HTML element which is a child of another HTML element using another controller.
$ctrl is the view model object in your controller. This $ctrl is a name you choose (vm is another most common name), if you check your code you can see the definition as $ctrl = this; , so basically its the this keyword of the controller function.
OnInitlinkA lifecycle hook that is called after Angular has initialized all data-bound properties of a directive.
Two-way BindingData binding in AngularJS is the synchronization between the model and the view. When data in the model changes, the view reflects the change, and when data in the view changes, the model is updated as well.
With angular 1.6, your bindings are going to be ready on the method $onInit and not before.
If you need to re-enable auto bindings https://toddmotto.com/angular-1-6-is-here#re-enabling-auto-bindings
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With