I am looping an array with ng-repeat but it only displays what is write in {{ }}.
There is not any error in the console though it's not displaying properly... Here is the code
<html ng-app="mittens">
<head>
<title>Mittens</title>
<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css">
<script type="text/javascript" href="angular.min.js"></script>
<script type="text/javascript" href="mittens.js"></script>
</head>
<body ng-controller="mittensController">
<div class="container">
<h3 ng-repeat="meow in meows">{{meow}}</h3>
</div>
</body>
Here is mittens.js file..
var app = angular.module('mittens',[]);
app.controller('mittensController',function($scope){
$scope.meows = [{
'This is first sentence',
'This is second sentence',
'This is third sentence',
'This is fourth sentence'
}];
});
Actually the reference link for mittens.js is wrongly loaded. You should use src instead of href
HTML:
<html ng-app="mittens">
<head>
<title>Mittens</title>
<link rel="stylesheet" type="text/css" href="bootstrap/css/bootstrap.min.css">
<script type="text/javascript" href="angular.min.js"></script>
<script src="mittens.js"></script>
</head>
<body ng-controller="mittensController">
<div class="container">
<h3 ng-repeat="meow in meows">{{meow}}</h3>
</div>
</body>
Script:
var app = angular.module('mittens',[]);
app.controller('mittensController',function($scope){
$scope.meows = [
'This is first sentence',
'This is second sentence',
'This is third sentence',
'This is fourth sentence'
]; //removed {} braces
});
UPDATE: here is the Plunker link if you want to reference.