Угловая петля не обновляется

Просто начался с углового. Мне удалось сохранить и извлечь данные из БД с помощью php. Я также могу зацикливать данные в элементе списка, но когда я добавляю нового пользователя, список не обновляется, только когда я обновляю браузер, он показывает вновь добавленного пользователя

это мой html-код:

<div> <ul ng-init="get_user()"> <li ng-repeat="user in userInfo ">{{user.user_name}}<a href="" ng-click="prod_delete(product.id)"> --> Delete</a></li> </ul> </div> 

это мой код app.js:

 var app = angular.module('AddUser', ['ui.bootstrap']); app.controller('AppCtrl', function($scope, $http){ $scope.userInfo = []; /** function to add details for a user in mysql referecing php **/ $scope.save_user = function() { $http.post('db.php?action=add_user', { 'user_name' : $scope.user_name, 'user_email' : $scope.user_email } ) .success(function (data, status, headers, config) { $scope.userInfo.push(data); console.log("The user has been added successfully to the DB"); console.log(data); }) .error(function(data, status, headers, config) { console.log("Failed to add the user to DB"); }); } /** function to get info of user added in mysql referencing php **/ $scope.get_user = function() { $http.get('db.php?action=get_user').success(function(data) { $scope.userInfo = data; console.log("You were succesfull in show user info"); //console.log(data); }) } }); 

По мере того как вы выполняете почтовый вызов, который сохраняет данные в DB по методу сервера, но в вашем успехе почтового вызова вы userInfo эти данные в объекте userInfo что технически звучит неправильно.

Я бы предпочел, чтобы вы сделали ajax для получения новых данных из db, используя $scope.get_user() после $scope.get_user() .

Код

 $scope.save_user = function() { $http.post('db.php?action=add_user', { 'user_name' : $scope.user_name, 'user_email' : $scope.user_email }).success(function (data, status, headers, config) { //$scope.userInfo.push(data); //remove this line $scope.get_user(); //this will fetch latest record from DB console.log("The user has been added successfully to the DB"); console.log(data); }).error(function(data, status, headers, config) { console.log("Failed to add the user to DB"); }); } 

Попробуйте изменить пользователя:

 $scope.save_user = function() { $http.post('db.php?action=add_user', { 'user_name' : $scope.user_name, 'user_email' : $scope.user_email }) .success(function (data, status, headers, config) { $scope.userInfo.push(data.data); console.log("The user has been added successfully to the DB"); console.log(data); }) .error(function(data, status, headers, config) { console.log("Failed to add the user to DB"); }); } 

Я думаю, что ваши данные, которые вы возвращаете, являются объектом, и любые данные, которые вы ожидаете, будут data.data, поэтому вы нажимаете недопустимый объект на свой массив userInfo