Is my React component updated instead of updating?

Question

I am trying to combine Angular and React.js. I have a sample work project here. I've seen a couple of ways to bring Angular and React.js together. One of the methods I've seen is creating a directive and creating a React component in a link function. For example, in the first part of the project to create a version of React (in red) I use

.directive('reactElementRepeater', function() {
    return {
      link: function(scope, element) {
        var update_react = function(oldVal, newVal){ //Called every time one of the two values change
          React.renderComponent(Demo_Element({
            numberOfElements: scope.myModel.numberOfElem, 
            numberInElements: scope.myModel.numberInElem
          }), element[0]);
        }
        scope.$watch('myModel.numberOfElem.length', update_react);
        scope.$watch('myModel.numberInElem', update_react);
      }
    }
  });

What I want and what needs to happen in an application that supports React is what is updated in the model, and then this update is sent through React, and it changes the DOM as little as possible to reflect this change. It seems that instead of updating the DOM part, it will each time create a new React component using renderComponent.

React.renderComponent() , DOM, .

? , , ? , ngReact, Angular React.

Answer 1

, , .

React.renderComponent(), - , . , dom, , .

, componentDidMount. , componentDidMount renderComponent. renderComponent dom , . getDefaultState getDefaultProps renderComponent.

, render , . , , render , . shouldComponentUpdate (http://facebook.imtqy.com/react/docs/component-specs.html#updating-shouldcomponentupdate) false. , , - , , - dom, .