このボタンは、ルートファイルに宣言されたファイルを開きます。ボタンボタンをクリックしてビュー(HTML)を開こうとしていますが、ボタンをクリックして新しいページを開けません。
ボタンをクリックすると、2つのtasbs(organizationPermissionConfig.html)の設定の新しいページが開きます。この最後のページには2つのタブがあり、各タブにはボタンをクリックする行のプロパティを編集できるテーブルがありますが、なぜこのボタンが新しいページを開いていないのか分かりません。
app.routes.js
.state('app.organizationPermissionsSettings', {
url: '/organization/permissionSettings/',
templateUrl: 'app/components/organizations/organizationPermissionsConfig.html',
resolve: {
deps: ['$ocLazyLoad', function ($ocLazyLoad) {
return $ocLazyLoad.load([
{
insertBefore: '#load_styles_before',
files: ['assets/libs/chosen_v1.4.0/chosen.min.css',
'assets/libs/datatables/css/jquery.dataTables.css']
},
{ serie: true,
files: [
'assets/libs/chosen_v1.4.0/chosen.jquery.min.js',
'assets/libs/datatables/js/jquery.dataTables.js',
'assets/libs/bootstrap-datatables/bootstrap-datatables.js'
]}]).then(function() {
return $ocLazyLoad.load([
{
files: ['app/components/organizations/organizationsController.js',
'app/shared/layout/utils.js']
}
])
});
}]
},
data: {
title: 'Settings',
}
})
.state('app.organization.graphs', {
url: '/graphs',
templateUrl: 'app/components/organizations/organizationGraphsView.html',
resolve: {
deps: ['$ocLazyLoad', function ($ocLazyLoad) {
return $ocLazyLoad.load([
{
insertBefore: '#load_styles_before',
files: ['assets/libs/chosen_v1.4.0/chosen.min.css',
'assets/libs/datatables/css/jquery.dataTables.css']
},
{ serie: true,
files: [
'assets/libs/chosen_v1.4.0/chosen.jquery.min.js',
'assets/libs/datatables/js/jquery.dataTables.js',
'assets/libs/bootstrap-datatables/bootstrap-datatables.js'
]}]).then(function() {
return $ocLazyLoad.load([
{
files: ['app/components/organizations/organizationsController.js']
}
])
});
}]
},
data: {
title: 'Organization Graphs',
}
})
.state('app.organization.views', {
url: '/views',
templateUrl: 'app/components/organizations/organizationViewsView.html',
resolve: {
deps: ['$ocLazyLoad', function ($ocLazyLoad) {
return $ocLazyLoad.load([
{
insertBefore: '#load_styles_before',
files: ['assets/libs/chosen_v1.4.0/chosen.min.css',
'assets/libs/datatables/css/jquery.dataTables.css']
},
{ serie: true,
files: [
'assets/libs/chosen_v1.4.0/chosen.jquery.min.js',
'assets/libs/datatables/js/jquery.dataTables.js',
'assets/libs/bootstrap-datatables/bootstrap-datatables.js'
]}]).then(function() {
return $ocLazyLoad.load([
{
files: ['app/components/organizations/organizationsController.js']
}
])
});
}]
},
data: {
title: 'Organization Views',
}
})
organizationController.js
app.controller('OrganizationsController',['$rootScope', '$scope', '$modal', 'HelperService', 'AuthService', '$state', '$http', function ($rootScope, $scope, $modal, HelperService, AuthService, $state, $http) {
var controllerScope = $scope;
controllerScope.organizationsData = {};
controllerScope.organizationsData.ajax = {url:'/api/organizations/', dataSrc:''};
controllerScope.organizationsData.ajax.beforeSend = function (xhr) {
xhr.setRequestHeader("Authorization", AuthService.authToken());
}
controllerScope.organizationsData.columns = [
{"data":null,"render":function(data) {
return '<a href="/#/organization/'+data.id+'">'+data.data.name+'</a>';
}},
{"data":"domain","defaultContent":""},
{"data":null, "orderable":false, "render":function(data){
return '<button class="btn btn-default btn-sm" style="margin-right:5px;" onclick="angular.element(this).scope().openOrganizationPermissionsSettings(\''+data.id+'\')"><i class="fa fa-wrench"></i></button>'
+'<button class="btn btn-default btn-sm" style="margin-right:5px; " onclick=\'angular.element(this).scope().openNewOrganizationModal('+JSON.stringify(data)+')\'><i class="fa fa-pencil"></i></button>'
+'<button class="btn btn-default btn-sm" onclick="angular.element(this).scope().deleteOrganization(\''+data.id+'\')"><i class="fa fa-trash"></i></button>';
}}];
controllerScope.deleteOrganization = function (organizationId) {
HelperService.deleteItem(organizationId, 'organization', '/api/organizations/');
};
controllerScope.openNewOrganizationModal = function (organization) {
var modalInstance = $modal.open({
templateUrl : 'newOrganizationModalContent.html',
controller: 'OrganizationsModalInstanceController',
resolve: {organization:function() {return organization}},
});
}
controllerScope.openOrganizationPermissionsSettings = function (organizationId) {
$state.go('app.organizationPermissionsSettings');
};
}]);
app.controller('OrganizationsPermissionsSettingsController',['$rootScope', '$scope', '$modal', 'HelperService', 'AuthService', '$state', '$http', function ($rootScope, $scope, $modal, HelperService, AuthService, $state, $http) {
var controllerScope = $scope;
controllerScope.organizationGroups = [];
$http.get('/api/organization_permissions_groups').success(function (data) {
console.log("data ",data);
controllerScope.organizationGroups = data;
});
controllerScope.openOrganizationPermissionsSettings = function (organizationId) {
$state.go('app.organizationPermissionsSettings');
};
}]);
app.controller('OrganizationGraphsController',['$rootScope', '$scope', '$modalInstance', 'HelperService', '$http', function ($rootScope, $scope, $modalInstance, HelperService, $http) {
var controllerScope = $scope;
controllerScope.organizationGroup = [];
console.log("GraphsModalInstanceController organization "+$rootScope.organization.id);
$http.get('/api/organization_permissions_groups/graphs/'+$rootScope.organization.id).success(function (data) {
controllerScope.organizationGroup = data;
});
$scope.cancel = function() {
$modalInstance.dismiss();
};
}
]);
app.controller('OrganizationViewsController',['$rootScope', '$scope', '$modalInstance', 'HelperService', '$http',
function ($rootScope, $scope, $modalInstance, HelperService, $http) {
var controllerScope = $scope;
controllerScope.organizationGroup = [];
$http.get('/api/organization_permissions_groups/views/'+$rootScope.organization.id).success(function (data) {
controllerScope.organizationGroup = data;
});
$scope.cancel = function() {
$modalInstance.dismiss();
};
}]);
organizationPermissionsConfig.html
<td><button class="btn btn-default btn-sm" ng-click="app.organization.graphs"><i class="fa fa-pencil"></i></button></td>
<td><button class="btn btn-default btn-sm" ng-click="app.organization.views"><i class="fa fa-pencil"></i></button></td>
:だから
$state.go
を使用するメソッドを実装する必要があります。また、同じようui-sref
ディレクティブを使用することができますstate 'app.organizationPermissionsSettings' " –これはあなたのナビゲーションが動作していることを意味しています:)今問題はあなたの州の定義の中にあります。あなたはあなたが現在在留している州から到達できない州にアクセスしようとしています。通常はあなたが州にいることに依存し、現在の州の直属の子ではありません。 – quirimmo
私のルートに定義しました上記のように "app.organizationPermissionsSettings"、 "app.organization.graphs"、 "'app.organization.views"ファイルを作成します。私は何を変える必要がありますか? –