Hi,
I want a dashboard with several widgets.
I decided to create a custom directive which represents a widget, the
attribute "type" defines which type of widget should be rendered.
As each widget has a complete different logic, I want separate view and
controller for each widget. So I need to assign different controller
functions to the directive, depending on the "type" attribute.
And this is where I'm stuck... or am I on a completely wrong way?
This is the code I have: (we are using 'browserify' with the npm require
function to require modules on compile time, so require() returns the
function.
*dashboard.js:*
.directive('dashboardWidget', function() {
var controllerFunction=null;
// ??? how to decide which controller func will be assigned / how to
access attributes here?
switch(attr.type) { // attr not accessible
case 'news':
controllerFunction=require('dashboard-widgets/news/news-controller);
break;
case 'links:
controllerFunction=require('dashboard-widgets/links/links-controller);
break;
}
return {
restrict: 'E', // only for elements!
scope: {
type: '@type'
},
controller: controllerFunction,
template: function(elem, attr) {
switch (attr.type) {
// @TODO: can we include this dynamically without switch?
case 'news':
return require('./dashboard-widgets/news/news.html');
case 'links':
return require('./dashboard-widgets/links/links.html');
}
}
}
})
*news.controller.js:*
module.exports = function($scope, ModelNewsFactory) {
console.log('news controller');
};
*dashboard.html:*
<dashboard-widget type="news"></dashboard-widget>
Thanks for any suggestions! :-)
--
You received this message because you are subscribed to the Google Groups
"AngularJS" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/angular.
For more options, visit https://groups.google.com/d/optout.
