我正在使用ui-grid到upload a XLS file through a directive and push the data
我正在尝试在我的指令和控制器之间移动数据(相当新的角度)。我经历了一堆线程(this,this,this和this),试图了解如何使用&
,{{ 1}},@
,=
和$watch
,但我仍然不明白如何将数据从指令(具有JSON对象)移动到数组(myData)在我的控制器中。如果有人能帮我解决这个问题......
控制器
$observe
指令
.controller('ListCtrl', function ($scope, $state, $log, ServerRequest, $localStorage, $sessionStorage, uiGridConstants) {
var vm = this, c = console;
$scope.sortAlert = sortAlert;
$scope.myData = [
{
"alert": "2",
"firstName": "Rob",
"lastName": "McBob",
"dob": "03/12/1941",
"sex": "M",
"mi": "C",
"referralReason": "Morbid Obesity",
"userStatus": "Schedules",
"timeSched": "02:00PM",
"homeNum": "416-555-5555",
"cellNum": "905-555-5555",
"notes": "cool",
"uniqueId": "638768756304"
}
];
//this formats the row
$scope.highlightFilteredHeader = function( row, rowRenderIndex, col, colRenderIndex ) {
if( col.filters[0].term ){
return 'header-filtered';
} else {
return '';
}
};
//handles the functionality of the grid
$scope.gridOptions = {
enableFiltering: true,
onRegisterApi: function(gridApi){
$scope.gridApi = gridApi; //so we can use gridapi functions of ui-grid
//handler for clicking rows
gridApi.selection.on.rowSelectionChanged($scope, function(row){
var thisRow = gridApi.selection.getSelectedRows() //gets the clicked row object
$log.log(thisRow);
//creates new tab -> the tabby part itselfid="' + thisRow[0].uniqueId + '"
$('.ui.top.attached.tabular.menu').append('<a class="active item" style="border-radius: 0px !important; background-color: #4B6A89; font-family: Roboto; font-size: 16px; color: white; font-weight: 300; letter-spacing: 1.5px;" id="' + thisRow[0].uniqueId + '" data-tab="' + thisRow[0].uniqueId + '">' + thisRow[0].firstName + ' ' + thisRow[0].lastName + '<i id="' + thisRow[0].uniqueId + '" class="material-icons" style="position: relative; right: -60px; font-weight: 200;">clear</i></a>'); //add ui bottom - the body of the tab
$('.tab-container').append('<div id="' + thisRow[0].uniqueId +'" class="ui bottom attached tab segment" data-tab="' + thisRow[0].uniqueId + '">' + 'new page' + '</div>');
reinitializeTabs(); //jquery to add ui-semantic tabs functionality to new tabs
});
},
data: 'myData',
columnDefs: [
{
field: 'alert', displayName: 'ALERTS', headerCellClass: $scope.highlightFilteredHeader,
sort: {
direction: uiGridConstants.DESC,
priority: 1
}
},
{
field: 'firstName', displayName: 'FIRST NAME', headerCellClass: $scope.highlightFilteredHeader
},
{
field: 'lastName', displayName: 'LAST NAME', headerCellClass: $scope.highlightFilteredHeader
},
{
field: 'dob', displayName: 'DOB', headerCellClass: $scope.highlightFilteredHeader
},
{
field: 'referralReason', displayName: 'REFERRAL REASON', headerCellClass: $scope.highlightFilteredHeader
},
{
field: 'userStatus', displayName: 'STATUS', headerCellClass: $scope.highlightFilteredHeader
},
{
field: 'timeSched', displayName: 'TIME', headerCellClass: $scope.highlightFilteredHeader
},
{
field: 'homeNum', displayName: 'HOME #', headerCellClass: $scope.highlightFilteredHeader
},
{
field: 'cellNum', displayName: 'CELL #', headerCellClass: $scope.highlightFilteredHeader
},
{
field: 'mi', displayName: 'MI', headerCellClass: $scope.highlightFilteredHeader
},
{
field: 'sex', displayName: 'SEX', headerCellClass: $scope.highlightFilteredHeader
},
{
field: 'notes', displayName: 'NOTES', headerCellClass: $scope.highlightFilteredHeader
},
{
field: 'uniqueId', displayName: 'UNIQUE ID', headerCellClass: $scope.highlightFilteredHeader
}
]
};
});
})//end of controller
答案 0 :(得分:1)
在你的指令中,声明对myData的引用(可以是任何名称):
scope: {
myData: '=',
opts: '='
}
指令用法(myData是控制器中的对象):
<fileread my-data="myData"></fileread>
现在,控制器和指令中的$ scope / scope指向同一资源。
@
用于单向数据绑定,因此您在评论中发布了错误。