angular.js - angular雙向綁定機(jī)制異常
問題描述
目前項目為當(dāng)頁面應(yīng)用admin,因為使用angular不是很多,但也做過一個項目。屬于原理不是很懂,但大概怎么知道使用的水平。最近遇見了一個讓我比較差異的問題。一直找不到問題的所在所以來此求angular的點(diǎn)評下我的異常,或者說angular的雙向綁定機(jī)制。
很簡單的一個table列表,我目前的增刪改查的功能大概步驟是這樣的:查詢:查詢新增:新增----新增成功后再一次調(diào)用一次查詢,實現(xiàn)了添加數(shù)據(jù)后立馬列表就成功顯示出來了不需要刷新。修改,刪除也是和新增一樣,成功后再一次調(diào)取查詢,更新一下數(shù)據(jù)列表。代碼如下: `
angular.module(’index_area’).controller(’GoodlistCtrl’,GoodlistCtrl);GoodlistCtrl.$inject = [’$state’,’GoodResource’,’PublicResource’,'$stateParams'];function GoodlistCtrl($state,GoodResource,PublicResource,$stateParams) {
document.title ='基礎(chǔ)商品列表';var vm = this;vm.pagecount; //分頁總數(shù)vm.pageint=1; //當(dāng)前分頁導(dǎo)航vm.skip=0 //從第幾個開始vm.limit=12;//從第幾個結(jié)束vm.list;//獲取頁面坐標(biāo)vm.index=$stateParams.index; PublicResource.navclass(vm.index)//分頁點(diǎn)擊事件vm.pageChanged = function(){ }//獲取sessionIdvm.seid=PublicResource.seid('cw19931024');//新增商品vm.addinfo = function(list){ GoodResource.addlist(list,vm.seid).then(function(data){console.log(data) })}//查詢基礎(chǔ)商品列表info_list(vm.seid);/**
基礎(chǔ)商品集合
@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(’您確定要刪除數(shù)據(jù)?’, { 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(’刪除異常,請聯(lián)系管理員~’, {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(’刪除異常,請聯(lián)系管理員~’, {icon: 0});} })}`
當(dāng)我判斷成功后立馬info_list()調(diào)用了一次查詢,但是結(jié)果卻是頁面的數(shù)據(jù)沒有及時更新,而是我第二次觸發(fā)刪除的時候他才更新了之前的數(shù)據(jù)。請問這個問題是什么原因呢?是因為angluar的渲染機(jī)制嗎?但是為什么我新增或者查詢的時候它能及時更新過來呢?
這是返回查詢的最新數(shù)據(jù),顯示我確實是刪除成功了,但是為什么就是無法同步就刷新呢?
問題解答
回答1:謝邀吧!不過,你這代碼貼的,我都醉了,還真是難看懂。
大概理了一下,你可以試著改改:
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);}); }}
相關(guān)文章:
1. android - weex 項目createInstanceReferenceError: Vue is not defined2. PHPExcel表格導(dǎo)入數(shù)據(jù)庫怎么導(dǎo)入3. android - 哪位大神知道java后臺的api接口的對象傳到前端后輸入日期報錯,是什么情況?求大神指點(diǎn)4. javascript - 如圖,百度首頁,查看源代碼為什么什么都沒有?5. pdo 寫入到數(shù)據(jù)庫的內(nèi)容為中文的時候?qū)懭雭y碼6. vue2.0+webpack 如何使用bootstrap?7. html - 根據(jù)用戶id實現(xiàn)論壇用戶頭像顯示的最佳實現(xiàn)8. 前端 - 為什么CSS transform-origin 屬性在 Chrome 和 Safari 中得到完全不同的效果?9. docker綁定了nginx端口 外部訪問不到10. PHP類封裝的插入數(shù)據(jù),總是插入不成功,返回false;
