[英]ng-repeat not populating table
我已經用JSON文件中的數據填充了一個表,然后當用戶單擊表中的項目時,一個容器及其字段顯示在下面,應該用該特定數據填充該容器,盡管不是。
通過list-patents.htm
調用select
函數,該列表包含帶有專利列表的表。 我使用了$rootScope
對象,因此可以從多個控制器(即patentDetailsCtrl
)訪問該函數
為什么在我的patent-item.htm
表中沒有填充ng-repeat
指令?
var app = angular.module('myApp', ['ngRoute', 'angularMoment', 'ui.router', "chart.js"]);
$stateProvider
.state("patents.list.item", {
url: "/patent-item",
templateUrl: "templates/patents/list/patent-item.htm",
params: {
id: null,
appNo: null,
clientRef: null,
costToRenew: null,
renewalDueDate: null,
basketStatus: null,
costBandEnd: null,
nextStage: null
},
controller: "patentDetailsCtrl"
})
app.run(function($rootScope) {
$rootScope.select = function() {
return $rootScope.patentItem = item;
}
});
app.controller('patentDetailsCtrl', ['$scope', '$http', function($scope, $http) {
$scope.selectedPatent = $scope.patentItem;
console.log($scope.selectedPatent);
}]);
list-patents.htm
<tbody>
<tr ng-repeat="x in patents">
<td ng-click="select(x)"><a ui-sref="patents.list.item({id: x.id, appNo: x.applicationNumber, clientRef: x.clientRef, costToRenew: x.costToRenew, renewalDueDate: x.renewalDueDate, basketStatus: x.basketStatus, costBandEnd: x.costBandEnd, nextStage: x.nextStage})">{{x.applicationNumber}}</a></td>
<td ng-bind="x.clientRef"></td>
<td ng-bind="x.costToRenew">$</td>
<td ng-bind="x.renewalDueDate"></td>
<td><button type="button" class="btn btn-danger" ng-click="remove(x.id)">Remove</button></td>
</tr>
</tbody>
專利項目
<table>
<tbody>
<thead>
<tr>
<td>applicationNumber</td>
<td>clientRef</td>
<td>costToRenew</td>
<td>renewalDueDate</td>
<td>basketStatus</td>
<td>costBandEnd</td>
<td>nextStage</td>
</tr>
</thead>
<tbody>
<tr ng-repeat="x in selectedPatent">
<td>{{x.applicationNumber}}</td>
<td>{{x.clientRef}}</td>
<td>{{x.costToRenew}}</td>
<td>{{x.renewalDueDate}}</td>
<td>{{x.basketStatus}}</td>
<td>{{x.costBandEnd}}</td>
<td>{{x.nextStage}}</td>
</tr>
</tbody>
</table>
</tbody>
您需要更正以下幾點:
您的$rootScope.select()
方法不接受從list-patents.htm
傳遞的數據( select(x)
),因此將item
作為參數。例如: $rootScope.select = function(item) { \\\\ code
正當您對$rootScope.patentItem
進行ng-repeat
,那么我想您需要將其設置為array
,並將push the passed data to it
。 (也不需要返回語句。)
所以運行塊應該像:
app.run(function($rootScope) {
rootScope.patentItem = [];
$rootScope.select = function(item) {
$rootScope.patentItem.push(item);
}
});
看到這個例子小提琴
對我來說,似乎您正在嘗試訪問在select函數中選擇的patentItem。 如果以這種方式將其傳遞給$ rootScope,則還需要以這種方式訪問它。
因此,請按如下所示更改該行...
$scope.selectedPatent = $rootScope.patentItem
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.