在ng-click上更新角度对象数组

时间:2016-03-01 08:54:34

标签: javascript arrays angularjs

与上一篇文章相关,我真的被用户点击更新我的角度应用中的对象数组。实际上,用户点击将强制http获取。在这里的示例代码中,我已经简化为硬编码数组。此外,真正的应用程序有多个选项卡,我已将代码缩减到关键,即在点击视图时更新对象。例如,视图中的表会丢失可选列。其他不好的事情发生在真正的应用程我怀疑有一些数据绑定问题?



<div class="mdl-layout mdl-js-layout mdl-layout--fixed-header mdl-layout--fixed-tabs">
	<header class="mdl-layout__header">
		<div class="mdl-layout__tab-bar mdl-js-ripple-effect">
			<a href="#fixed-tab-1" ng-click="activateTab('Assets')"  class="mdl-layout__tab">Assets</a>
			<div class="mdl-layout-spacer"></div>
		</div>
	</header>
	<main class="mdl-layout__content">
		<section class="mdl-layout__tab-panel is-active" id="fixed-tab-1">
			<div class="page-content">		 
				<div class="table-content mdl-grid">				
					<div  class="mdl-cell mdl-cell--6-col">
						<table id=table1 
							class="table-fullwidth mdl-data-table mdl-data-table--selectable mdl-js-data-table mdl-shadow--4dp" >
							<thead>
								<tr>
									<th class="mdl-data-table__cell--non-numeric"><span class="table-header">Asset</span></th>
								</tr>
							</thead>
							<tbody>
								<tr ng-repeat="x in restdata">
									<td class="mdl-data-table__cell--non-numeric mdl-typography--thin">{{ x.asset }}</td>
								</tr>
							</tbody>						
						</table>
					</div>			
				</div> 
			</div> 		
		</section>		
	</main>
</div>
&#13;
&#13;
&#13;

我的简单js是这样的:

&#13;
&#13;
var app = angular.module('homeApp.protect', []);

app.controller('protectCtrl', ['$scope', function($scope) {	
	$scope.tabcount = 0;
	$scope.restdata = [];
	$scope.response = [ {"id":"1","asset":"V-1-A1"},
	       			 	{"id":"2","asset":"V-2-A1"},
	       			 	{"id":"3","asset":"V-1-A2"},
	       			 	{"id":"4","asset":"V-2-A2"}];
  
	// activate tabs entered by user
    $scope.activateTab = function (tabId) {
    	$scope.tabcount++;
    	console.log("In activate tab " + tabId + " tabcount = " + $scope.tabcount);
		
    	// get lists of all assets for all agents
		if (tabId == "Assets")  { 
			angular.copy($scope.response, $scope.restdata);
			console.log($scope.restdata);		
		};
		
    };  
    //Default entry on page load
    $scope.activateTab ("Assets")
}]);
&#13;
&#13;
&#13;

在初始加载时,可选复选框看起来很好。在随后的标签点击中,它们会从行中消失(仅显示在标题中)。我见过动态数据的其他问题。感谢。

0 个答案:

没有答案