this.$components[ 'checkboxid'].value ( ) is not a function
this.$components[ 'checkboxid'].value returns undefined
this.$components[ 'checkboxid'].checked ( ) is not a function
this.$components[ 'checkboxid'].checked returns undefined.
checkboxes are not included in the Telerik demos or docs.
How do I get the value of a checkbox?
You can check the "checked" property:
angular.element("#checkbox0").prop("checked")
Surely this is the point where you should compare and contrast this.$components['x'] and angular.element("#x") and explain when and why we should use one versus the other.
Just a couple of points:
* The expression angular.element("#x") can be used to access an HTML based element using its ID. In general, you can use a selector to query the elements.
* The expression.$components['x'] corresponds to the reference in controller.js. This reference is used to specify options and event handlers. This reference is used from template.html. Some this.$components references may include a widget property that points to the Kendo UI widget (example Kendo UI Grid).
It is important to know where you are in the life cycle of the component.
For example, to set an option using this.$components, you would need to use it from the constructor or a point prior to the instantiation of the component.
To query the widget property for a grid, you would need to do it at a point you know that the widget has been instantiated. You use $scope.$watch to watch for the point when the widget property has been set.
(In other cases, checking for kendoWidgetCreated can be used.)
I hope this helps.