Find your content:

Search form

You are here

Can anyone explain the difference between Reacts one-way data binding and Angular's two-way data binding? - Interview questions - HelpInterview

 
Share

Can anyone explain the difference between React one-way data binding and Angular's two-way data binding? - Interview questions - HelpInterview

When angular sets up databinding two "watchers" exist. Refer below example

$scope.name= "test";
$timeout(function($scope.name="another"}, 1000);
$timeout(function(){console.log($scope.name),}, 5000);

<input ng-model = 'name'>

The input will start out with test, then update to another in 1000ms. Any changes
to $scope.name either from controller code or by changing the input, will be
reflected in the console.log 4000ms later. Changes to the <input/> are
reflected in the $scope.name property automatically.


React
React doesn't have a mechanism to allow the HTML to change the component. The HTML
can only raise events that the component responds to. The typicalexample is

render(){
return <input value={this.state.value} onChange={this.handleChange}>
}
handleChange(e){
this.setState({value:e.target.value});
}

The value of the <input /> is controlled entirely by the render function. The only
way to update this value is from the component itself, which is done by
attaching an onChange event to the <input/> which sets this.state.value t with the
react component metho setState.

My Block Status

My Block Content