angularjs双向数据绑定与春天，mybatis和宁静的服务

我正在开发与CURD操作angulatJS应用程序。angularjs双向数据绑定与春天，mybatis和宁静的服务

在我的应用程序中，我将创建，编辑和删除记录！我可以做到这一点，但我无法绑定模型中的数据，因为我需要重新启动浏览器才能看到更新。

这里是我的代码...任何输入将不胜感激。

这是我的主要JS

angular.module('serviceClient', ['serviceClient.services','serviceClient.controllers','ngRoute']). 
 
    config(['$routeProvider', function ($routeProvider) { 
 
     $routeProvider.when('/home', {templateUrl: 'pages/home.html'}); 
 
     $routeProvider.when('/testcases-list', {templateUrl: 'pages/testlist.html', controller: 'serviceCtrl'}); 
 
     $routeProvider.when('/test-edit/:id', {templateUrl: 'pages/test-details.html', controller: 'TCDetailCtrl'}); 
 
     $routeProvider.when('/testcases-creation', {templateUrl: 'pages/testcases-creation.html', controller: 'TCCreationCtrl'}); 
 
     $routeProvider.otherwise({redirectTo: '/home'}); 
 
     
 
     }]);

'use strict'; 
 

 
var app = angular.module('serviceClient.controllers', []); 
 

 

 

 
app.run(function ($rootScope, $templateCache) { 
 
    $rootScope.$on('$viewContentLoaded', function() { 
 
     $templateCache.removeAll(); 
 
    }); 
 
}); 
 

 

 
//list 
 
app.controller('serviceCtrl', [ 'DemoService','DemoService2', '$scope', '$location', 
 
\t \t function(DemoService,DemoService2, $scope, $location) { 
 
\t 
 
\t \t \t $scope.editTestCase= function(userId) { 
 
\t \t \t \t $location.path('/test-edit/'+userId); 
 
\t \t \t }; 
 

 
\t \t \t $scope.deleteTestCase = function(userId) { 
 
\t \t \t \t DemoService2.remove({ id: userId }); 
 
\t \t \t \t 
 
\t \t \t }; 
 

 
\t \t \t $scope.createNewTestCase = function() { 
 
\t \t \t \t $location.path('/testcases-creation'); 
 
\t \t \t }; 
 

 
\t \t \t DemoService.query(function(DemoService) { 
 
\t \t \t \t $scope.response = DemoService; 
 
\t \t \t }); 
 

 
\t \t } ]); 
 

 
//create 
 
app.controller('TCCreationCtrl', [ '$scope', 'DemoService', '$location', 
 
\t \t function($scope, DemoService, $location) { 
 
\t \t \t \t $scope.createNewTestCase = function() { 
 
\t \t \t \t DemoService.create($scope.testCase); 
 
\t \t \t \t $location.path('/testcases-list'); 
 
\t \t \t \t 
 
\t \t \t \t } 
 
\t \t } ]); 
 

 
//update 
 
app.controller('TCDetailCtrl', [ '$scope', '$routeParams', 'DemoService2', 
 
\t \t '$location', function($scope, $routeParams, DemoService2, $location) { 
 
\t \t \t //alert("update"); 
 
\t \t \t $scope.updateTestCase = function() { 
 
\t \t \t \t DemoService2.update($scope.testCase); 
 
\t \t \t \t $location.path('/testcases-list'); 
 
\t \t \t }; 
 
\t \t \t 
 
\t \t \t $scope.cancel = function() { 
 
\t \t \t $location.path('/testcases-list'); 
 
\t \t \t }; 
 

 
\t \t \t $scope.testCase = DemoService2.show({ 
 
\t \t \t id : $routeParams.id 
 
\t \t \t }); 
 
\t \t \t 
 
\t \t } ]);

'use strict'; 
 

 
var app = angular.module('serviceClient.services', [ 'ngResource' ]); 
 

 

 
app.factory('DemoService', function($resource) { 
 
\t return $resource('http://localhost:8080/', {}, { 
 
\t \t query : {method : 'GET',params : {},isArray : true}, 
 
\t \t create: {method: 'POST'} 
 
\t }); 
 
}); 
 

 

 
app.factory('DemoService2', function($resource) { 
 
\t return $resource('http://localhost:8080/:id', {}, { 
 
\t \t show: { method: 'GET' }, 
 
\t \t update: { method: 'PUT', params: {id:'@id'} }, 
 
\t \t remove:{method: 'DELETE',params: {id:'@id'} } 
 
\t }); 
 
});

这里，如果任何插入/更新/删除操作，我想立即在前端和后端看到。

我试图重新加载，$承诺...但我阻止了一些地方！

感谢

来源

2016-02-26 ajay

如果进行任何插入/更新/删除，你的意思是什么：你的意思是说，当前连接的用户执行其中一项操作时，你没有看到它们或当其他用户这样做？ – Walfrat

是的，如果我插入一条记录，我想看前端应该重新加载该记录。 – ajay

为了您我的评论的答复，我会说，“我”也只是当前连接的用户，而不是另一个连接的用户。

你有这样的双向：

重新加载页面。容易，但会触发很多不必要的服务器请求。
的项目添加到列表一旦服务器在数据库中成功地增加了这一点，你必须使用一个资源的$承诺领域：

DemoService.create($scope.testCase).$promise.then(function(){ 
    $scope.myDatas.push($scope.testCase); 
});

你说，你tryed $承诺，如果这不起作用，请在浏览器中打开调试控制台，向我们展示当您尝试创建元素时服务器发送的请求以及服务器的答案。

来源

2016-02-29 07:59:32 Walfrat

angularjs双向数据绑定与春天，mybatis和宁静的服务

回答

相关问题