I'm trying to use Angular 1.5.0-beta.0
which I have installed from npm
.
According to some guides - we can now create a component using module.component
instead of the old fashion module.directive
.
This is the component code:
export default angular.module('app.components.header', [])
.component('dashboardHeader', {
controller: 'HeaderCtrl as headerCtrl',
template: `This is test.`
})
;
My html is:
<body>
<dashboard-header></dashboard-header>
<div ui-view="content">
</body>
I'm getting:
angular.module(...).component is not a function
What could be the problem?
Components can be registered using the . component() method of an AngularJS module (returned by angular. module() ).
Components are the most basic UI building block of an Angular app. An Angular app contains a tree of Angular components. Angular components are a subset of directives, always associated with a template. Unlike other directives, only one component can be instantiated for a given element in a template.
OnInitlinkA lifecycle hook that is called after Angular has initialized all data-bound properties of a directive.
$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.
I had the same issue did a
bower install angular
it still gave the same error ,
Finally I updated the version of angular.js in script src tag and it worked .
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>
There is nothing wrong with your code. Install the stable release of angular 1.5. I had the same problem and then deleted angular and installed it with:
bower install angular
Make sure you are not using old version of Angular JS CDN
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