asked on March 16, 2016
Hi,
Presently, we are creating the component in angular controller side, due to this we are facing many issues.
The suggestion, I would like to ask is how to create the component in angular js(.html) side. flexmonster control always define in the <script> tag, but when we use jsPivotCreationCompleteHandler in the component we should call the method from angular controller to html. I guess that is not possible. if so, please give me some example or syntax for that.
In clear, please provide one example on angular side where component should create or define in .html file with jsPivotCreationCompleteHandler: "pivotCreationCompleteHandler" and pivotCreationCompleteHandler should call/define from controller.
I attached sample code which we are using in our angular project(.html and .controller) for your reference
Please provide us the solution for this in angular(create component in .html), this would be very helpful for us.
Thanks & Regards,
Sunilkumar.V
⋅ March 16, 2016
Hi Kumar!
Thank you for your question. Please check our very last response in parallel, where you can find the reference to the useful recommendations about angular.js project.
Please let me know if you find it helpful.
⋅ March 17, 2016
Hi Kumar,
Could you please provide us with your angular project .html (in addition to .controller you provided)?
Thank you,
Iryna
⋅ March 18, 2016
Hi Kumar,
Please download an example of using Flexmonster Pivot component in AngularJS (with Routing & Multiple Views) - https://s3.amazonaws.com/flexmonster/downloads/FLEXMONSTER-ANGULAR-JS-MULTIPLE-VIEWS-SAMPLE.zip
We recommend creating the component in the controller. The function embedPivotComponent() returns the reference to the instance of the component and the key point is that the component's API has to be accessed via this reference. You can store it in $scope and access it from both, html and controller:
$scope.flexmonsterInstance = flexmonster.embedPivotComponent("flexmonster/", "pivot-container", "100%", "500", {
licenseKey: "....",
jsPivotCreationCompleteHandler: setPivotReport
}, true);
function setPivotReport() {
var report = getReportByID($scope.reportId);
$scope.flexmonsterInstance.setReport(report);
}
Please review the sample inside the package for more details.
We will appreciate if you could let us know whether the suggested approach works for you.
Kind regards,
Iryna
⋅ December 5, 2016
Hello Sunilkumar.V and all Flexmonster users,
We would like to inform you that starting from version 2.3 we improved integration with popular frameworks. Follow our detailed tutorial for Angular: Integration with Angular. Or find more details about integration with other frameworks and technologies: https://www.flexmonster.com/doc/available-tutorials-integration/.
Regards,
Tanya