Я получаю сообщение об ошибке неожиданного токена, где начинается jsx. Как использовать встроенный контроллер JSX? Мне нужно каким-то образом изменить атрибут файла?
controller: function($scope, $t){
var Table = FixedDataTable.Table;
var Column = FixedDataTable.Column;
React.render(
<Table
rowHeight={50}
rowGetter={rowGetter}
rowsCount={rows.length}
width={5000}
height={5000}
headerHeight={50}>
<Column
label="Col 1"
width={3000}
dataKey={0}
/>
<Column
label="Col 2"
width={500}
dataKey={1}
/>
</Table>,
document.getElementById('table')
);
вы не можете определить функцию рендеринга внутри js файла, который должен находиться в файле jsx. Вы не можете просто начать добавлять код с другого языка в файлы js. Я рекомендую вам прочитать эту статью. Facebook React vs AngularJS: более внимательный взгляд
Мы используем bower-react
на наш проект. И код должен выглядеть примерно так
Ваша директива:
link: function(scope, element) {
var tableComponent = React.renderComponent(
react.table({
myParam: myValue
}),
element.find('#table').get(0)
);
}
Как вы видите, Angular вызывает функцию renderComponent
и renderComponent
параметры или обратные вызовы. Если изменения модели вы должны вызвать tableComponent.setState(newData)
из Angular, а также
Ваш jsx файл:
/** @jsx React.DOM */
(function(react) {
'use strict';
// Vars
// Functions
react.table = React.createClass({
render: function() {
return(
<Table
myParam={this.props.myParam}
rowHeight={50}
rowGetter={rowGetter}
rowsCount={rows.length}
width={5000}
height={5000}
headerHeight={50}>
<Column
label="Col 1"
width={3000}
dataKey={0}
/>
<Column
label="Col 2"
width={500}
dataKey={1}
/>
</Table>
);
}
});
}(react));