changed bindings from expressions to ng-bind and ng-model. Changed pe…

…rcentage to number datatype in items.json
Brianmanden · May 29, 2016 · 96ef203 · 96ef203
1 parent 7b0c9cf
commit 96ef203
Show file tree

Hide file tree

Showing 2 changed files with 18 additions and 14 deletions.
diff --git a/data/items.json b/data/items.json
@@ -3,21 +3,21 @@
 		{
 			"label": "Red Smoothie",
 			"vineyard": "Bobs Wines",
-			"percentage": "18",
+			"percentage": 18,
 			"comment": "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis maximus est vitae aliquet mollis. Donec bibendum augue a mauris commodo porta. Sed non lacus odio. Nunc convallis vestibulum justo, vel lobortis sapien tempus sit amet.",
 			"image": "/img/wine01.jpg"
 		},
 		{
 			"label": "Purple Haze",
 			"vineyard": "Jimis Grapes Inc.",
-			"percentage": "12",
+			"percentage": 12,
 			"comment": "Købt hos Jimi´s Fine Wines på Mallorca i 1969.",
 			"image": "/img/wine02.jpg"
 		},
 		{
 			"label": "The Redster",
 			"vineyard": "Plain Wine Inc.",
-			"percentage": "17",
+			"percentage": 17,
 			"comment": "Vestibulum eros magna, hendrerit a dictum vel, rhoncus ut libero. Phasellus rutrum accumsan eleifend. Nulla eget ligula odio. Aliquam nec commodo elit. Nam ut commodo leo.",
 			"image": "/img/wine03.jpg"
 		}

diff --git a/templates/inventory.html b/templates/inventory.html
@@ -12,35 +12,39 @@ <h3>{{item.label}}</h3>
 			</ul>
 
 			<div class="tab-content">
+
 				<div id="short{{$index}}" class="tab-pane fade in active">
-					<p>{{item.label}}</p>
-					<p>by {{item.vineyard}}</p>
-					<p>{{item.percentage}}% vol.</p>
+					<b ng-bind="item.label"></b>
+					<p>produced by <b ng-bind="item.vineyard"></b></p>
+					<p><b ng-bind="item.percentage"></b><b>% vol.</b></p>
 				</div>
+
 				<div id="full{{$index}}" class="tab-pane fade">
-					<p>{{item.label}}</p>
-					<p>by {{item.vineyard}}</p>
-					<p>{{item.percentage}}% vol.</p>
-					<p>{{item.comment}}</p>
+					<b ng-bind="item.label"></b>
+					<p>produced by <b ng-bind="item.vineyard"></b></p>
+					<p><b ng-bind="item.percentage"></b><b> % vol.</b></p>
+					<p ng-bind="item.comment"></p>
 				</div>
+
 				<div id="edit{{$index}}" class="tab-pane fade">
 					<div class="form-group">
 						<label for="label">Label:</label>
-						<input type="text" class="form-control" id="label" value="{{item.label}}">
+						<input type="text" class="form-control" id="label" ng-model="item.label">
 					</div>
 					<div class="form-group">
 						<label for="Vineyard">Vineyard:</label>
-						<input type="text" class="form-control" id="Vineyard" value="{{item.vineyard}}">
+						<input type="text" class="form-control" id="Vineyard" ng-model="item.vineyard">
 					</div>
 					<div class="form-group">
 						<label for="percentage">Percentage:</label>
-						<input type="number" step="any" class="form-control" id="percentage" value="{{item.percentage}}">
+						<input type="number" step="any" class="form-control" id="percentage" ng-model="item.percentage">
 					</div>
 					<div class="form-group">
 						<label for="comment">Comment:</label>
-						<textarea class="form-control" rows="5" id="comment">{{item.comment}}</textarea>
+						<textarea class="form-control" rows="5" id="comment" ng-model="item.comment"></textarea>
 					</div>
 				</div>
+
 			</div>
 		</div>
 	</div>