MacKentoch/angularparse.html

## angularparse.html
<!doctype >
<html ng-app="app">

	<head>

		<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-alpha1/jquery.min.js"></script>
		<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/css/bootstrap.css">
		<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/js/bootstrap.js">
		<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.3/angular.js"></script>
	</head>

	<body ng-controller="ctrl as vm">
		<div class="container">


			<div class="jumbotron">
				<h1>test de parse</h1>
				<p>model initial de unObject</p>
				<div class="row">
					<div class="col-md-6">
						<h3>Initial model</h3>
						<pre>{{vm.modelInitial | json}}</pre>
					</div>
					<div class="col-md-6">
						<h3>Parsed model</h3>
						<pre>{{vm.modelChange | json}}</pre>
					</div>
				</div>
			</div>

	</div>
	<script>
		;
		'use strict';

		(function(){
			angular
			.module('app', [])
			.controller('ctrl', ['$parse', '$scope',
				function($parse, $scope){
					self = this;
					/**
					 * base model
					 */
					self.unObjet = {
						prop1 : 'prop1',
						prop2 : 'prop2',
						prop3 : 'prop3',
						prop4 : 'prop4',
						prop5 : 'prop5',
					};
					/**
					 * list of this base model
					 * as demo model
					 */
					self.listInitiale = [];
					self.listInitiale.push(
								{
									line : 1 ,
									value : self.unObjet
								}
								);
					self.listInitiale.push(
								{
									line : 2 ,
									value : self.unObjet
								}
								);
					/**
					 * initial model
					 */
					 self.modelInitial = angular.copy(self.listInitiale);

					 /**
						* parsed model
						* If I wanted to change property called "prop2" of the 1st line only (by "listInitiale[0]")
						*
						* $parse will change all prop2 from my model not only the 1st line
					  */
						$parse('listInitiale[0].value.prop2').assign(self, 'a change');
					 	self.modelChange = angular.copy(self.listInitiale);

					/**
					 *
					 */
			}]);


		})()

	</script>

	</body>

</html>
	<!doctype >
	<html ng-app="app">

	<head>

	<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.0.0-alpha1/jquery.min.js"></script>
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/css/bootstrap.css">
	<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.5/js/bootstrap.js">
	<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.3/angular.js"></script>
	</head>

	<body ng-controller="ctrl as vm">
	<div class="container">


	<div class="jumbotron">
	<h1>test de parse</h1>
	<p>model initial de unObject</p>
	<div class="row">
	<div class="col-md-6">
	<h3>Initial model</h3>
	<pre>{{vm.modelInitial \| json}}</pre>
	</div>
	<div class="col-md-6">
	<h3>Parsed model</h3>
	<pre>{{vm.modelChange \| json}}</pre>
	</div>
	</div>
	</div>

	</div>
	<script>
	;
	'use strict';

	(function(){
	angular
	.module('app', [])
	.controller('ctrl', ['$parse', '$scope',
	function($parse, $scope){
	self = this;
	/**
	* base model
	*/
	self.unObjet = {
	prop1 : 'prop1',
	prop2 : 'prop2',
	prop3 : 'prop3',
	prop4 : 'prop4',
	prop5 : 'prop5',
	};
	/**
	* list of this base model
	* as demo model
	*/
	self.listInitiale = [];
	self.listInitiale.push(
	{
	line : 1 ,
	value : self.unObjet
	}
	);
	self.listInitiale.push(
	{
	line : 2 ,
	value : self.unObjet
	}
	);
	/**
	* initial model
	*/
	self.modelInitial = angular.copy(self.listInitiale);

	/**
	* parsed model
	* If I wanted to change property called "prop2" of the 1st line only (by "listInitiale[0]")
	*
	* $parse will change all prop2 from my model not only the 1st line
	*/
	$parse('listInitiale[0].value.prop2').assign(self, 'a change');
	self.modelChange = angular.copy(self.listInitiale);

	/**
	*
	*/
	}]);


	})()

	</script>

	</body>

	</html>