因为无缝的数据绑定,所以我刚刚开始将正在进行的旧网站转换为使用angular而不是jquery。
现在我有一个正在填充数据集的选择;
<select ng-model="affiliation" ng-options="row.desc for row in affiliationTable"> <!--group by row.id-->
<option value=""> Select an existing affiliation</option>
</select>
当用户点击表格中的锚标记时,我希望在选择中选择相应的“从属关系”,因此我的表格看起来像这样;
<tr ng-repeat="row in tableData"> <!--{{row.name}}-->
<td><a href='#' ng-click="invokeModal();" onclick="lastClickedMember=this.id;" id="{{row.id}}">{{row.name}}</a></td>
<td>{{row.active}}</td>
<td>{{row.end_date}}</td>
<td>{{row.start_date}}</td>
</tr>
这是我用来尝试选择特定选项的代码;
$scope.invokeModal = function(){ //memberDescription
for(var row in $scope.tableData){
if($scope.tableData[row].id == lastClickedMember){
$scope.selectedMembershipDescription = $scope.tableData[row].desc;
$scope.selectedMembershipId = lastClickedMember;
$scope.selectedEndDate = $scope.tableData[row].end_date;
$scope.selectedStartDate = $scope.tableData[row].start_date;
}
if($scope.affiliationTable[row].id == lastClickedMember){
$scope.affiliation = $scope.affiliationTable[row]; //$scope.selectedMembershipDescription;
}
}
jQuery("#mem").modal('show');
};
当然在尝试此代码以及其他一些选项后,我的选择仍然没有填充选项。
请有人帮助我。
修改 这是表格的填充方式;
$http(
{
url: "http://localhost/get_info.php",
method: "POST",
data: "filter=membership&cid=2",
headers: {'Content-Type': 'application/x-www-form-urlencoded'}
}
).
success(function(data, status, headers, config) {
// this callback will be called asynchronously
// when the response is available
//alert("first row: " + data.name[0]);
for(var row in data.name){
$scope.tableData.push({id:data.name[row][0], name:data.name[row][5], active:(data.name[row][1] == "0") ? "Not Active" : "Active", end_date:data.name[row][3], start_date:data.name[row][2]});
}
});
//get affiliation table
$scope.affiliationTable = [];
$http({
url: "http://localhost/get_info.php",
method: "POST",
data: "filter=affiliation",
headers: {'Content-Type': 'application/x-www-form-urlencoded'}
}).success(function(data, status, headers, config) {
// this callback will be called asynchronously
// when the response is available
for(var row in data.name){
$scope.affiliationTable.push({id:data.name[row][0], desc:data.name[row][1]});
}
});
答案 0 :(得分:1)
尝试
<tr ng-repeat="row in tableData">
<!--{{row.name}}-->
<td><a href='#' ng-click="invokeModal(row);" id="{{row.id}}">{{row.name}}</a>
</td>
<td>{{row.active}}</td>
<td>{{row.end_date}}</td>
<td>{{row.start_date}}</td>
</tr>
和
$scope.invokeModal = function (row) { //memberDescription
$scope.selectedMembershipDescription = row.desc;
$scope.selectedMembershipId = row.id;
$scope.selectedEndDate = row.end_date;
$scope.selectedStartDate = row.start_date;
angular.forEach($scope.affiliationTable, function (affiliation) {
if (affiliation.id == row.id) {
$scope.affiliation = affiliation;
}
})
jQuery("#mem").modal('show');
};