[ANGULAR] How to set Project Start Date

[mv2022]

When changing the date filter to update the project start date, nothing happens. The Start Date for the task remains the same. I'm not sure if I am updating the wrong properties or If I need to include something else.

     setProjectStartDateChange(value : any): void {
        this.gantt.startDate = DateHelper.add(value, -1, 'week');
        this.gantt.setStartDate(value);
      }

 <bryntum-date-field
    label="Project Start"
    width="17em"
    (onChange)="setProjectStartDateChange($event)"
    ></bryntum-date-field>

[marcio]

Hey,

At the onChange method, you're passing the $event as a parameter, with that, if you check the value variable here setProjectStartDateChange(value : any) you'll see that the correct value is passed inside it as a property, if you change to this everything will work correctly

setProjectStartDateChange(event: any): void {
    const date = event.value;
    this.gantt.setStartDate(date);
}

[mv2022]

I tried doing this as well and the Gantt chart does not update the task to the new project start date. I'm using the inline-date demo.

export class AppComponent implements OnInit, AfterViewInit {

  etc ...
  

ganttConfig = ganttConfig;
projectConfig = projectConfig;

private gantt!: Gantt;
private project!: ProjectModel;

private dataSet = 0;

@ViewChild('gantt') ganttComponent!: BryntumGanttComponent;
@ViewChild('project') projectComponent!: BryntumProjectModelComponent;

// Inject data service
constructor(private dataService:DataService) {}
ngAfterViewInit(): void {
    this.project = this.projectComponent?.instance;
    this.gantt = this.ganttComponent?.instance;
    this.gantt.project = this.project;
}

ngOnInit(): void {
    // Get initial data
    Object.assign(this, this.dataService.getData());

}


 setProjectStartDateChange(event : any): void {
    this.gantt.startDate = DateHelper.add(event.value, -1, 'week');
    this.gantt.setStartDate(event.value);
  }
}

<div class = "demo-toolbar align-right">
    <bryntum-date-field
    label="Project Start"
    width="17em"
    (onChange)="setProjectStartDateChange($event)"
    ></bryntum-date-field>
</div>

<bryntum-project-model
    #project
		etc....
</bryntum-project-model>
<bryntum-gantt
    #gantt
		etc...
</bryntum-gantt>

[marcio]

Hey,

When you use

this.gantt.setStartDate(event.value);

you are setting the Gantt current view to that date.

To update the project, you need to use

this.project.startDate = event.value;