angular ctrlAs

Asked by AG
8 years ago.

Can I use ctrlAs syntax rather than using $scope for config and events objects?

I am having an issue with the following pseudo code

// html
<daypilot

scheduler id="dp" config="ctrl.dpConfig" events="ctrl.dpEvents"></daypilot-scheduler>

// controller

var ctrl = this;
ctrl.dpConfig = {config options};
ctrl.dpEvents = [];

$http.get('/endpoint').then(function(result) {

$scope.dp.resources = result.data.resources;
$scope.dp.events.list = result.data.events;

$scope.dp.update()

});

The events get rendered as expected but if I then try and move one the UI doesn't update. If I put a $scope.dp.update() inside the onEventMove callback it works but I shouldn't have to do this should I?

It seems that using $scope.dp.events.list doesn't push the data onto my ctrl.dpEvents object?

Comment posted by Dan Letecky [DayPilot]
8 years ago.

1. Normally, if you use $scope objects for the bindings (daypilot-events, daypilot-config attributes) changes made to these objects are propagated automatically. If you use the direct API (i.e. dp.events.list, dp.resources) you need to call update()..

2. Let me check how to use the controllerAs model instead of $scope. It might need a change or two inside DayPilot.

Answer posted by Dan Letecky [DayPilot]
8 years ago.

The latest sandbox version (8.2.2038) now fully supports controllerAs syntax:

<div ng-app="main" ng-controller="SchedulerCtrl as ctrl" >
  <daypilot-scheduler
          id="dp"
          config="ctrl.config"
          events="ctrl.events"
          publish-as="ctrl.scheduler"
          on-event-selected="ctrl.onEventSelected(args)"
          on-event-moved="ctrl.onEventMoved(args)"
  >
  </daypilot-scheduler>

The new "publish-as" attribute lets you specify where the DayPilot.Scheduler object will be stored.

It also supports "on-*" attributes that automatically bind event handlers. The event handlers bound this way are automatically wrapped in $apply() so you don't have to do it inside the function body.

You can see a live example in the sandbox:

http://javascript.daypilot.org/sandbox/scheduler/angularjsctrlas.html

Comment posted by Matthew
8 years ago.

Does the trial version contain this change?

Comment posted by Dan Letecky [DayPilot]
8 years ago.

Yes, it's available since release 8.2:
http://javascript.daypilot.org/daypilot-pro-for-javascript-8-2/

If you download the latest trial version it will work:
http://javascript.daypilot.org/try/

This question is more than 1 months old and has been closed. Please create a new question if you have anything to add.

angular ctrlAs

Products

Learn

Get Support

DayPilot Pro