Using React-data-grid in Angular 1.x

Question

I have ngReact installed and I am able to create a basic component (Hello World) in my Angular 1.3 project using this article: https://www.logilab.org/blogentry/7366955

But I am not sure how to use react-data-grid in my Angular app. What component name does one use? Has anyone done this? I would welcome a little guidance! Thanks!

Answer 1

Not knowing much of angular just by reading your article you will need to do a few things.

You will need to import react-data-grid as a script, you can check they way to do it in here.

After that ReactDataGridcomponent will be available to you and you can do the same thing you do for the example in your link. If you're not using jsx it will be better if you take a look in here. The final code for you will be something like this

 // define a React component that displays "Hello {name}"
 var GridComponent = React.createClass({
    render: function() {
       var props = { x: this.props.x, y: this.props.y ...};
       // you can filter the props or just inject this.props
       return React.createElement(ReactDataGrid, props, null);
    }
 });

To use that you just need to create the grid controller that will look something like this:

 <div ng-app="app" ng-controller="helloController">
   <react-component name="GridElement" props="yourProps" />
 </div>