Angularjs 角度UI引导模式结果未定义
我正在构建一个应用程序,点击ng网格行中的按钮即可加载模式。显示模式和正确的数据非常有效。问题在于从模式中的表单中获取数据。这段代码Angularjs 角度UI引导模式结果未定义,angularjs,modal-dialog,angular-ui-bootstrap,Angularjs,Modal Dialog,Angular Ui Bootstrap,我正在构建一个应用程序,点击ng网格行中的按钮即可加载模式。显示模式和正确的数据非常有效。问题在于从模式中的表单中获取数据。这段代码 modalInstance.result.then(function(selectedItem){ $scope.selected = selectedItem; }); 返回“selectedItem”的“未定义” 这是模态 <div ng-app="myApp"> <d
modalInstance.result.then(function(selectedItem){
$scope.selected = selectedItem;
});
返回“selectedItem”的“未定义”
这是模态
<div ng-app="myApp">
<div ng-controller="UsersCtrl">
<script type="text/ng-template" id="editUserModal.html">
<div class="modal-header">
<h3 class="modal-title">Edit User <em>{{user.user_full_nm}} {{user.user_id}}</em></h3>
</div>
<div class="modal-body">
<p>User Name: <input type="text" name="user_full_nm" value="{{user.user_full_nm}}"></p>
<p>Email: <input type="text" name="user_nm" value="{{user.user_nm}}"></p>
<p>Active:
<select ng-model="user.deleted" ng-selected="user.deleted">
<option value="0" ng-selecte>Active</option>
<option value="1">Inactive</option>
</select>
</p>
<p>Termination Date: {{user.termination_date | date:'longDate'}}</p>
<p>Last Entry Date: {{user.last_entry | date:'longDate'}}</p>
</div>
<div class="modal-footer">
<button class="btn btn-primary" ng-click="ok()">OK</button>
<button class="btn btn-warning" ng-click="cancel()">Cancel</button>
</div>
</script>
<div class="gridStyle" ng-grid="gridOptions"></div>
</div>
</div>
编辑用户{{User.User_full_nm}{{User.User_id}
用户名:
电邮:
活动:
活跃的
不活跃的
终止日期:{{user.Termination_Date}日期:'longDate'}
最后输入日期:{{user.Last_Entry}日期:'longDate'}
好啊
取消
这是Angular应用程序
var app = angular.module('myApp', ['ngGrid','ui.bootstrap']);
app.controller('UsersCtrl', function($scope, $http, $modal) {
$scope.filterOptions = {
filterText: "",
useExternalFilter: false
};
$scope.totalServerItems = 0;
$scope.pagingOptions = {
pageSizes: [20, 40, 60],
pageSize: 20,
currentPage: 1
};
$scope.setPagingData = function(data, page, pageSize){
var pagedData = data.slice((page - 1) * pageSize, page * pageSize);
$scope.userData = pagedData;
$scope.totalServerItems = data.length;
if (!$scope.$$phase) {
$scope.$apply();
}
};
$scope.getPagedDataAsync = function (pageSize, page, searchText) {
setTimeout(function () {
var data;
if (searchText) {
var ft = searchText.toLowerCase();
$http.get('getUsers').success(function (largeLoad) {
data = largeLoad.filter(function(item) {
return JSON.stringify(item).toLowerCase().indexOf(ft) != -1;
});
$scope.setPagingData(data,page,pageSize);
});
} else {
$http.get('getUsers').success(function (largeLoad) {
$scope.setPagingData(largeLoad,page,pageSize);
});
}
}, 100);
};
$scope.getPagedDataAsync($scope.pagingOptions.pageSize, $scope.pagingOptions.currentPage);
$scope.$watch('pagingOptions', function (newVal, oldVal) {
if (newVal !== oldVal && newVal.currentPage !== oldVal.currentPage) {
$scope.getPagedDataAsync($scope.pagingOptions.pageSize,$scope.pagingOptions.currentPage,$scope.filterOptions.filterText);
}
}, true);
$scope.$watch('filterOptions', function (newVal, oldVal) {
if (newVal !== oldVal) {
$scope.getPagedDataAsync($scope.pagingOptions.pageSize, $scope.pagingOptions.currentPage,
$scope.filterOptions.filterText);
}
}, true);
var editUserButtonTemplate = '<i class="fa fa-pencil" style="cursor:pointer;" ng-click="editUser(row.entity)"></i>';
$scope.gridOptions = {
data: 'userData',
columnDefs: [
{field: 'user_id', displayName: 'User ID', visible: false},
{field: 'user_nm', displayName: 'Email'},
{field: 'user_full_nm', displayName: 'Name'},
{field: 'deleted', displayName: 'Active', width: 60, cellFilter: 'activeFilter'},
{field: 'termination_date', displayName: 'Termination Date',cellFilter: 'date:\'longDate\''},
{field: 'last_entry', displayName: 'Last Entry Date',cellFilter: 'date:\'longDate\''},
{field: '', DisplayName: '', cellTemplate: editUserButtonTemplate, colFilterText: '', width:20}
],
enablePaging: true,
showFooter: true,
showFilter: true,
enableRowSelection: false,
filterOptions: $scope.filterOptions,
totalServerItems:'totalServerItems',
pagingOptions: $scope.pagingOptions,
filterOptions: $scope.filterOptions
};
/************ open the edit user modal *********************/
$scope.editUser = function(value) {
var modalInstance = $modal.open({
templateUrl: 'editUserModal.html',
// scope: $scope,
controller: 'editUserCtrl',
resolve: {
user: function () {
return value;
}
}
});
modalInstance.result.then(function(selectedItem){
$scope.selected = selectedItem;
});
};
});
app.controller('editUserCtrl', function($scope, $http, $modalInstance, user) {
$scope.user = user;
$scope.ok = function () {
$modalInstance.close($scope.selected);
};
$scope.cancel = function () {
$modalInstance.dismiss('cancel');
};
});
// for the 'deleted' column, display 'Active' or 'Inactive' instead of 1 or 0
app.filter('activeFilter', function(){
var types = ['Active', 'Inactive'];
return function(type){
return types[type];
};
});
var-app=angular.module('myApp',['ngGrid','ui.bootstrap']);
app.controller('UsersCtrl',函数($scope,$http,$modal){
$scope.filterOptions={
筛选文本:“”,
useExternalFilter:false
};
$scope.totalServerItems=0;
$scope.pagingOptions={
页面大小:[20,40,60],
页面大小:20,
当前页:1
};
$scope.setPagingData=函数(数据、页面、页面大小){
var pagedData=data.slice((第1页)*页面大小,页面*页面大小);
$scope.userData=pagedData;
$scope.totalServerItems=data.length;
如果(!$scope.$$phase){
$scope.$apply();
}
};
$scope.getPagedDataAsync=函数(页面大小、页面、搜索文本){
setTimeout(函数(){
var数据;
如果(搜索文本){
var ft=searchText.toLowerCase();
$http.get('getUsers').success(函数(largeLoad){
数据=大负荷过滤器(功能(项目){
返回JSON.stringify(item).toLowerCase().indexOf(ft)!=-1;
});
$scope.setPagingData(数据、页面、页面大小);
});
}否则{
$http.get('getUsers').success(函数(largeLoad){
$scope.setPagingData(大负载、页面、页面大小);
});
}
}, 100);
};
$scope.getPagedDataAsync($scope.paginOptions.pageSize,$scope.paginOptions.currentPage);
$scope.$watch('pagingOptions',函数(newVal,oldVal){
如果(newVal!==oldVal&&newVal.currentPage!==oldVal.currentPage){
$scope.getPagedDataAsync($scope.paginOptions.pageSize,$scope.paginOptions.currentPage,$scope.filterOptions.filterText);
}
},对);
$scope.$watch('filterOptions',函数(newVal,oldVal){
if(newVal!==oldVal){
$scope.getPagedDataAsync($scope.pagingOptions.pageSize,$scope.pagingOptions.currentPage,
$scope.filterOptions.filterText);
}
},对);
var editUserButtonTemplate='';
$scope.gridOptions={
数据:“userData”,
columnDefs:[
{字段:'user_id',显示名称:'user id',可见:false},
{字段:'user_nm',显示名称:'Email'},
{字段:'user_full_nm',显示名称:'Name'},
{字段:'deleted',显示名称:'Active',宽度:60,cellFilter:'activeFilter'},
{字段:“终止日期”,显示名称:“终止日期”,单元格筛选器:“日期:\'longDate\''},
{字段:'last\u entry',显示名称:'last entry Date',cellFilter:'Date:\'longDate\''},
{字段:'',显示名称:'',单元格模板:editUserButtonTemplate,colFilterText:'',宽度:20}
],
enablePaging:true,
showFooter:是的,
showFilter:是的,
enableRowSelection:false,
filterOptions:$scope.filterOptions,
totalServerItems:'totalServerItems',
分页选项:$scope.pagingOptions,
filterOptions:$scope.filterOptions
};
/************打开编辑用户模式*********************/
$scope.editUser=函数(值){
var modalInstance=$modal.open({
templateUrl:'editUserModal.html',
//范围:$scope,
控制器:“editUserCtrl”,
决心:{
用户:函数(){
返回值;
}
}
});
modalInstance.result.then(函数(selectedItem){
$scope.selected=selectedItem;
});
};
});
app.controller('editUserCtrl',函数($scope,$http,$modalInstance,user){
$scope.user=用户;
$scope.ok=函数(){
$modalInstance.close($scope.selected);
};
$scope.cancel=函数(){
$modalInstance.disclose('cancel');
};
});
//对于“已删除”列,显示“活动”或“非活动”,而不是1或0
app.filter('activeFilter',function(){
变量类型=[“活动”、“非活动”];
返回函数(类型){
返回类型[类型];
};
});
正如经常发生的那样,我一发布我的问题就发现了这个问题
这让我想到了问题所在
$scope.ok = function () {
$modalInstance.close($scope.selected);
};
已将$scope.selected更改为$scope.user,它现在正在按预期工作