angular.js - angular双向绑定机制异常

问题描述

目前项目为当页面应用admin，因为使用angular不是很多，但也做过一个项目。属于原理不是很懂，但大概怎么知道使用的水平。最近遇见了一个让我比较差异的问题。一直找不到问题的所在所以来此求angular的点评下我的异常，或者说angular的双向绑定机制。

很简单的一个table列表，我目前的增删改查的功能大概步骤是这样的：查询:查询新增:新增----新增成功后再一次调用一次查询，实现了添加数据后立马列表就成功显示出来了不需要刷新。修改，删除也是和新增一样，成功后再一次调取查询，更新一下数据列表。代码如下： `

angular.module(’index_area’).controller(’GoodlistCtrl’,GoodlistCtrl);GoodlistCtrl.$inject = [’$state’,’GoodResource’,’PublicResource’,'$stateParams'];function GoodlistCtrl($state,GoodResource,PublicResource,$stateParams) {

document.title ='基础商品列表';var vm = this;vm.pagecount; //分页总数vm.pageint=1; //当前分页导航vm.skip=0 //从第几个开始vm.limit=12;//从第几个结束vm.list;//获取页面坐标vm.index=$stateParams.index; PublicResource.navclass(vm.index)//分页点击事件vm.pageChanged = function(){ }//获取sessionIdvm.seid=PublicResource.seid('cw19931024');//新增商品vm.addinfo = function(list){ GoodResource.addlist(list,vm.seid).then(function(data){console.log(data) })}//查询基础商品列表info_list(vm.seid);/**

基础商品集合

@param {Object} seid*/

info_list(){

GoodResource.list(vm.seid,vm.skip,vm.limit).then(function(data){ vm.list=data.result; console.log(data.result) })

}

vm.getmack = function(id){

$state.go('/good/format',{'id':id})

}

vm.delinfo = function(id){

layer.confirm(’您确定要删除数据？’, { btn: [’确定’,’取消’] //按钮 }, function(){ remove(id); });

}

remove(id){

GoodResource.dellist(vm.seid,id).then(function(data){ console.log(data)if (data.status=='OK') { layer.msg(’删除成功~’, {icon: 1}); info_list(vm.seid); layer.closeAll(); } else{ layer.msg(’删除异常，请联系管理员~’, {icon: 0}); } })

}}

`可以看出删除在删除代码:`function remove(id){

GoodResource.dellist(vm.seid,id).then(function(data){console.log(data) if (data.status=='OK') {layer.msg(’删除成功~’, {icon: 1}); info_list(vm.seid); layer.closeAll();} else{ layer.msg(’删除异常，请联系管理员~’, {icon: 0});} })}`

当我判断成功后立马info_list()调用了一次查询，但是结果却是页面的数据没有及时更新，而是我第二次触发删除的时候他才更新了之前的数据。请问这个问题是什么原因呢？是因为angluar的渲染机制吗？但是为什么我新增或者查询的时候它能及时更新过来呢？

这是返回查询的最新数据，显示我确实是删除成功了，但是为什么就是无法同步就刷新呢？

问题解答

谢邀吧！不过，你这代码贴的，我都醉了，还真是难看懂。

大概理了一下，你可以试着改改：

GoodlistCtrl.$inject = [’$scope’, ’$state’,’GoodResource’,’PublicResource’,'$stateParams'];function GoodlistCtrl($scope, $state,GoodResource,PublicResource,$stateParams) { function info_list(){GoodResource.list(vm.seid,vm.skip,vm.limit).then(function(data){ vm.list=data.result; $scope.$apply(); console.log(data.result);}); }}