I am currently working on a problem with angular js (only worked with it for a while). In an attempt to fix that problem, I have tried to isolate it by using a duplicate copy of my work and deleting everything else which is not needed.
I added a specific piece of code, and I know that this specific piece of code should be working but it's not. Before I can even try to integrate it and see if it actually works with it, I'd need to try to figure out if there is truly something wrong with it.
I have also created new external copies of the js files and css as well for that purpose and correctly linked them.
Basically, the problem I have is that I keep seeing this piece of code in my browser instead of the actual text that should be written:
I see this in my browser (yes scripts are enabled in the browser)...
{{phone.name}} {{phone.snippet}}
But obviously, this shouldn't be the thing appearing.
This is the html:
<!doctype html>
<html ng-app="phonecatApp">
<head>
<meta charset="utf-8">
<title>title</title>
<link rel="stylesheet" type="text/css" href="css/bootstraptwo.css" />
</head>
<body ng-controller="PhoneListCtrl">
<script type="text/javascript" src="js/apptwo.js"></script>
<script type="text/javascript" src="js/angulartwo.js"></script>
<div class="container-fluid">
<div class="row">
<div class="col-md-2">
<!--Sidebar content-->
Search: <input ng-model="query">
Sort by:
<select ng-model="orderProp">
<option value="name">Alphabetical</option>
<option value="age">Newest</option>
</select>
</div>
<div class="col-md-10">
<!--Body content-->
<ul class="phones">
<li ng-repeat="phone in phones">
<span>{{phone.name}}</span>
<p>{{phone.snippet}}</p>
</li>
</ul>
</div>
</div>
</div>
</body>
</html>
This is the angular:
(function(){
'use strict';
/* Controllers */
var phonecatApp = angular.module('phonecatApp', []);
phonecatApp.controller('PhoneListCtrl', function($scope) {
$scope.phones = [
{'name': 'Nexus S',
'snippet': 'Fast just got faster with Nexus S.',
'age': 1},
{'name': 'Motorola XOOM™ with Wi-Fi',
'snippet': 'The Next, Next Generation tablet.',
'age': 2},
{'name': 'MOTOROLA XOOM™',
'snippet': 'The Next, Next Generation tablet.',
'age': 3}
];
$scope.orderProp = 'age';
});
});