0
Ich bin neu in MEAN Stack und ich habe versucht, eine einfache Kontakt-App zu machen. Aber ng-repeat in meiner index.html funktioniert nicht. Hier ist mein Code. Die Dateien werden nach Standard-Dateistruktur von Expressng-repeat funktioniert nicht in MEAN stack
index.html
<html ng-app="myApp" xmlns:ng="http://www.w3.org/1999/xhtml">
<head>
<title>First Application x</title>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css" integrity="sha384-rHyoN1iRsVXV4nD0JutlnGaslCJuC7uwjduW9SVrLvRYooPp2bWYgmgJQIXwl/Sp" crossorigin="anonymous">
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.8/angular.min.js"> </script>
</head>
<body>
<div class="container" ng-controller="AppCtrl">
<h1>Phone Directory</h1>
<table class="table">
<thead>
<tr>
<th>Name</th>
<th>Email</th>
<th>Phone</th>
<th>Action</th>
</tr>
</thead>
<tbody>
<tr>
<td><input class="form-control" type="text" placeholder="Enter name"></input></td>
<td><input class="form-control" type="text" placeholder="Email"></input></td>
<td><input class="form-control" type="text" placeholder="Phone No." ></input></td>
<td><button class="btn btn-danger">Add Contact</button></td>
</tr>
<tr ng-repeat="contact in contactlist">
<td class="info">{{ contact.name }}</td>
<td class="info">{{ contact.email }}</td>
<td class="info">{{ contact.phone }}</td>
<td class="info">{{ contact.phone }}</td>
</tr>
</tbody>
</table>
</div>
<script src="/javascripts/controllers/controller.js"></script>
</body>
</html>
controller.js
var myApp = angular.module('myApp', []);
myApp.controller('AppCtrl',['$scope', '$http', function($scope, $http){
$http.get('/contactlist').success(function(response){
$scope.contactlist = response;
console.log(response);
console.log("Hello World from controller");
});
}]);
index.js
var express = require('express');
var router = express.Router();
/* GET home page. */
router.get('/', function(req, res, next) {
res.render('index', { title: '' });
});
router.get('/contactlist',function(req,res){
person1={
name: 'Tim',
email: '[email protected]',
phone: '111 111 -1111'
};
person2={
name: 'Tim cook',
email: '[email protected]',
phone: '222 111 -1111'
};
person3={
name: 'Tim Baron',
email: '[email protected]',
phone: '222 333 -1111'
};
var contactlist=[person1,person2,person3];
res.json(contactlist);
});
module.exports = router;
erhalten Sie einen Fehler auf der Konsole? wenn ja, dann schreiben pls –
@ kapil.dev keine ..auf Konsole ich keine Störung erhalte folgende URL auf ur-Browser –
eingeben und lassen Sie mich wissen, was Displays ist localhost: {port}/Kontaktliste wenn Port 3000 zB: http: // localhost: 3000/kontaktliste –