Html Angular JS-切换到不同的选项卡并在单击时调用函数-

Html Angular JS-切换到不同的选项卡并在单击时调用函数-,html,angularjs,mean-stack,Html,Angularjs,Mean Stack,我在一个选项卡中有一个表单,在另一个选项卡中有提交的申请列表。 如果我在表单上单击edit,我应该从数据库加载数据并转到其他选项卡。在ng上单击,我可以检索数据,但无法更改选项卡 以下是相关文件: navbar.html <nav class="navbar navbar-default navbar-cls-top " role="navigation" style="margin-bottom: 0"> <div class="navbar-header"&

我在一个选项卡中有一个表单,在另一个选项卡中有提交的申请列表。 如果我在表单上单击
edit
,我应该从数据库加载数据并转到其他选项卡。在
ng上单击
,我可以检索数据,但无法更改选项卡

以下是相关文件: navbar.html

<nav class="navbar navbar-default navbar-cls-top " role="navigation" style="margin-bottom: 0">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".sidebar-collapse">

            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" href="index.html"></a>
    </div>

    <div class="header-right">



        <a href="" ng-click="logout()" class="btn btn-danger" title="Logout"><i class="fa fa-sign-out fa-2x"></i></a>

    </div>
</nav>
<!-- /. NAV TOP  -->
<nav class="navbar-default navbar-side" role="navigation" style="width:200px">
    <div class="sidebar-collapse">
        <ul class="nav" id="main-menu">
            <li>
                    <div class="inner-text">
                        {{user.name}}
                    <br />
                        <small> </small>
                    </div>
                </div>

            </li>

            <li>
                <a id="page1" ng-class='{"active-menu": selectedMenu == "dashboard"}' ui-sref="secured.dashboard" ng-click='selectedMenu = "dashboard"'><i class="fa fa-dashboard "></i>Dashboard</a>
            </li>
            <li>
                <a id="page2" ng-class='{"active-menu": selectedMenu == "applicationForm"}' ui-sref="secured.applicationForm" ng-click='selectedMenu = "applicationForm"'><i class="fa fa-handshake-o "></i>Application Forms</a>
            </li>

             <li>
                <a ng-class='{"active-menu": selectedMenu == "logout"}' href="" ng-click="logout()" ng-click='selectedMenu = "logout"'><i class="fa fa-sign-out fa-fw"></i> Logout</a>
            </li>


        </ul>

    </div>

</nav>
applicationForm.js:

(function() {
    var app = angular.module('applicationForm', []);
    app.config(['$stateProvider', function($stateProvider) {
        $stateProvider.state('secured.applicationForm', {
            url: '/applicationForm',
            controller: 'applicationFormController',
            templateUrl: '/views/applicationForm.html'
        });
    }]);

    app.controller('applicationFormController', ['$http', '$scope', '$state', '$uibModal', function($http, $scope, $state, $uibModal) {

        $scope.application = {
            technical: false,
            business: false
        };

        var refresh = function(){
            $http.get('/application/applicationList').then(function(response){
                console.log("I got the applications I requested");
                $scope.applicationList = response.data;
                console.log($scope.applicationList);
                $scope.pagination = {};
                // $scope.totalItems = 200;
                $scope.pagination.currentPage = 0;
                $scope.numPerPage = 10;
            });

        };
        refresh();

        $scope.saveApplication = function(){
            console.log($scope.application);
            console.log($scope.applicationList);
            var check = 0;
            $scope.application.state = "saved";
            $scope.application.userEmail = $scope.user.email;

            for (var i=0, len=$scope.applicationList.length; i < len; i++) {
                if ($scope.applicationList[i]._id == $scope.application._id) {
                    check = 1;
                    console.log("matched");
                    break;
                }
            }
            if(check == 1){
                $http.put('/application/applicationlist/' + $scope.application._id, $scope.application).then(function(response){
                    //$scope.contact = response.data;
                    refresh();
                });
            }
            else{
                $http.post('/application/applicationList', $scope.application).then(function(response){
                    console.log(response);
                    refresh();
                });
            }
            swal({
                title: "Great!",
                text: "We have saved your application",

                type: "success",
                timer: 3000,
                confirmButtonText: "Wohoo!"
            });
            clear();
        };


        $scope.submitApplication = function(){
            console.log("Submit called");
            console.log($scope.application.title);
            console.log($scope.user.email);
            $scope.application.userEmail = $scope.user.email;
            $scope.application.state = "submit";
            var check = 0;

            for (var i=0, len=$scope.applicationList.length; i < len; i++) {
                if ($scope.applicationList[i]._id == $scope.application._id) {
                    check = 1;
                    console.log("matched");
                    break;
                }
            }

            if(check == 1){
                $http.put('/applicationlist/' + $scope.application._id, $scope.application).then(function(response){
                    refresh();
                });
            }
            else{
                $http.post('/application/applicationList', $scope.application).then(function(response){
                    console.log("Successfully submitted");

                    refresh();
                });
            }
            swal({
                title: "Great!",
                text: "We have received your request",
                type: "success",

                timer: 3000,
                confirmButtonText: "Wohoo!"
            });
            clear();
        };

        var clear = function(){
            $scope.application = {
                technical: false,
                business: false
            };
        };

        //Universities
        $scope.application.selectname1={id:100,name: 'None'};
        $scope.application.selectname2={id:100,name: 'None'};
        $scope.application.selectname3={id:100,name: 'None'};

        $scope.filter1 = function(item){
          return (!($scope.application.selectname1&&$scope.application.selectname1.id)||item.id !=$scope.application.selectname1.id||item.id==100);
        };

        $scope.filter2 = function(item){
          return (!($scope.application.selectname2&&$scope.application.selectname2.id)||item.id!=$scope.application.selectname2.id||item.id==100);
        };
        $scope.filter3 = function(item){
          return (!($scope.application.selectname3&&$scope.application.selectname3.id)||item.id !=$scope.application.selectname3.id||item.id==100);
        };
        $scope.universities = [
            {
                id:1,
                name: 'IITs'
            },
            {
                id:2,
                name: 'IIITs'
            },
            {
                id:3,
                name: 'BITS'
            },
            {
                id:4,
                name: 'IISc'
            },
            {
                id:100,
                name: 'None'
            }
        ];


        //Degrees
        $scope.application.selectdegree1={id:100,name: 'None'};
        $scope.application.selectdegree2={id:100,name: 'None'};
        $scope.application.selectdegree3={id:100,name: 'None'};

        $scope.filterDegree1 = function(item){
          return (!($scope.application.selectdegree1&&$scope.application.selectdegree1.id)||item.id !=$scope.application.selectdegree1.id||item.id==100);
        };

        $scope.filterDegree2 = function(item){
          return (!($scope.application.selectdegree2&&$scope.application.selectdegree2.id)||item.id!=$scope.application.selectdegree2.id||item.id==100);
        };
        $scope.filterDegree3 = function(item){
          return (!($scope.application.selectdegree3&&$scope.application.selectdegree3.id)||item.id !=$scope.application.selectdegree3.id||item.id==100);
        };
        $scope.degrees = [
            {
                id:1,
                name: 'PhD'
            },
            {
                id:2,
                name: 'Masters'
            },
            {
                id:3,
                name: 'BTech'
            },
            {
                id:100,
                name: 'None'
            }
        ];

        $scope.pageChanged = function() {
            //alert('Page changed to: ' + $scope.pagination.currentPage);
            //$scope.pagination.currentPage = page;
            var begin = (($scope.pagination.currentPage - 1) * $scope.numPerPage);
            //var end = begin + $scope.numPerPage;
            $scope.getPatents(begin)
        };


    }]);
})();
(函数(){
var app=angular.module('applicationForm',[]);
app.config(['$stateProvider',函数($stateProvider){
$stateProvider.state('secured.applicationForm'{
url:“/applicationForm”,
控制器:“applicationFormController”,
templateUrl:“/views/applicationForm.html”
});
}]);
app.controller('applicationFormController'、['$http'、'$scope'、'$state'、'$uibModal',函数($http、$scope、$state、$uibModal){
$scope.application={
技术:错,
业务:虚假
};
var refresh=function(){
$http.get('/application/applicationList')。然后(函数(响应){
log(“我得到了我请求的应用程序”);
$scope.applicationList=response.data;
log($scope.applicationList);
$scope.pagination={};
//$scope.totalItems=200;
$scope.pagination.currentPage=0;
$scope.numPerPage=10;
});
};
刷新();
$scope.saveApplication=函数(){
log($scope.application);
log($scope.applicationList);
var检查=0;
$scope.application.state=“已保存”;
$scope.application.userEmail=$scope.user.email;
对于(变量i=0,len=$scope.applicationList.length;i(function() {
    var app = angular.module('dashboard', []);
    app.config(['$stateProvider', function($stateProvider) {
        $stateProvider.state('secured.dashboard', {
            url: '/dashboard',
            controller: 'DashboardController',
            templateUrl: '/views/dashboard.html'
        });
    }]);

    app.controller('DashboardController', ['$scope', 'AuthService', 'user', '$state', '$http', function($scope, AuthService, user, $state, $http) {
        $scope.user = user;
        AuthService.setUser(user);

        $scope.logout = function() {
            AuthService.logout().then(function() {
                $scope.user = null;
                $state.go('unsecured');
            })
        }

        var refresh = function(){
            $http.get('/application/applicationList').then(function(response){
                console.log("I got the applications I requested");
                $scope.applicationList = response.data;
                console.log($scope.applicationList);
                $scope.pagination = {};
                // $scope.totalItems = 200;
                $scope.pagination.currentPage = 0;
                $scope.numPerPage = 10;
            });

        };
        refresh();

        $scope.remove = function(id){
            var del = false;
            swal({
                title: 'Are you sure?',
                text: "You won't be able to revert this!",
                type: 'warning',
                showCancelButton: true,
                confirmButtonColor: '#3085d6',
                focusCancel: true,
                allowEscapeKey: true,
                allowEnterKey: true,
                allowOutsideClick: true,
                cancelButtonColor: '#d33',
                confirmButtonText: 'Yes, delete it!',
                cancelButtonText: 'No, cancel!',
                confirmButtonClass: 'btn btn-success',
                cancelButtonClass: 'btn btn-danger',
                buttonsStyling: false
                }).then(function () {
                    $http.delete('/application/applicationlist/'+id).then(function(response){
                        clear();
                        refresh();
                    });
                    swal(
                    'Deleted!',
                    'Your Application has been deleted.',
                    'success'
                    )
                }, function (dismiss) {
                // dismiss can be 'cancel', 'overlay',
                // 'close', and 'timer'
                    if (dismiss === 'cancel') {
                        swal(
                          'Cancelled',
                          'Your Application is safe :)',
                          'error'
                        )
                    }

            })
        };

        $scope.edit = function(id){
            console.log(id);
            console.log("Edit function called");
            $http.get('/application/applicationList/'+id).then(function(response){
                $scope.application = response.data;
                console.log($scope.application);
                //refresh();
                $scope.changeTab(event, 'page1');
            });

        };

        var clear = function(){
            $scope.application = {
                technical: false,
                business: false
            };
        };


    }]);
})();
(function() {
    var app = angular.module('applicationForm', []);
    app.config(['$stateProvider', function($stateProvider) {
        $stateProvider.state('secured.applicationForm', {
            url: '/applicationForm',
            controller: 'applicationFormController',
            templateUrl: '/views/applicationForm.html'
        });
    }]);

    app.controller('applicationFormController', ['$http', '$scope', '$state', '$uibModal', function($http, $scope, $state, $uibModal) {

        $scope.application = {
            technical: false,
            business: false
        };

        var refresh = function(){
            $http.get('/application/applicationList').then(function(response){
                console.log("I got the applications I requested");
                $scope.applicationList = response.data;
                console.log($scope.applicationList);
                $scope.pagination = {};
                // $scope.totalItems = 200;
                $scope.pagination.currentPage = 0;
                $scope.numPerPage = 10;
            });

        };
        refresh();

        $scope.saveApplication = function(){
            console.log($scope.application);
            console.log($scope.applicationList);
            var check = 0;
            $scope.application.state = "saved";
            $scope.application.userEmail = $scope.user.email;

            for (var i=0, len=$scope.applicationList.length; i < len; i++) {
                if ($scope.applicationList[i]._id == $scope.application._id) {
                    check = 1;
                    console.log("matched");
                    break;
                }
            }
            if(check == 1){
                $http.put('/application/applicationlist/' + $scope.application._id, $scope.application).then(function(response){
                    //$scope.contact = response.data;
                    refresh();
                });
            }
            else{
                $http.post('/application/applicationList', $scope.application).then(function(response){
                    console.log(response);
                    refresh();
                });
            }
            swal({
                title: "Great!",
                text: "We have saved your application",

                type: "success",
                timer: 3000,
                confirmButtonText: "Wohoo!"
            });
            clear();
        };


        $scope.submitApplication = function(){
            console.log("Submit called");
            console.log($scope.application.title);
            console.log($scope.user.email);
            $scope.application.userEmail = $scope.user.email;
            $scope.application.state = "submit";
            var check = 0;

            for (var i=0, len=$scope.applicationList.length; i < len; i++) {
                if ($scope.applicationList[i]._id == $scope.application._id) {
                    check = 1;
                    console.log("matched");
                    break;
                }
            }

            if(check == 1){
                $http.put('/applicationlist/' + $scope.application._id, $scope.application).then(function(response){
                    refresh();
                });
            }
            else{
                $http.post('/application/applicationList', $scope.application).then(function(response){
                    console.log("Successfully submitted");

                    refresh();
                });
            }
            swal({
                title: "Great!",
                text: "We have received your request",
                type: "success",

                timer: 3000,
                confirmButtonText: "Wohoo!"
            });
            clear();
        };

        var clear = function(){
            $scope.application = {
                technical: false,
                business: false
            };
        };

        //Universities
        $scope.application.selectname1={id:100,name: 'None'};
        $scope.application.selectname2={id:100,name: 'None'};
        $scope.application.selectname3={id:100,name: 'None'};

        $scope.filter1 = function(item){
          return (!($scope.application.selectname1&&$scope.application.selectname1.id)||item.id !=$scope.application.selectname1.id||item.id==100);
        };

        $scope.filter2 = function(item){
          return (!($scope.application.selectname2&&$scope.application.selectname2.id)||item.id!=$scope.application.selectname2.id||item.id==100);
        };
        $scope.filter3 = function(item){
          return (!($scope.application.selectname3&&$scope.application.selectname3.id)||item.id !=$scope.application.selectname3.id||item.id==100);
        };
        $scope.universities = [
            {
                id:1,
                name: 'IITs'
            },
            {
                id:2,
                name: 'IIITs'
            },
            {
                id:3,
                name: 'BITS'
            },
            {
                id:4,
                name: 'IISc'
            },
            {
                id:100,
                name: 'None'
            }
        ];


        //Degrees
        $scope.application.selectdegree1={id:100,name: 'None'};
        $scope.application.selectdegree2={id:100,name: 'None'};
        $scope.application.selectdegree3={id:100,name: 'None'};

        $scope.filterDegree1 = function(item){
          return (!($scope.application.selectdegree1&&$scope.application.selectdegree1.id)||item.id !=$scope.application.selectdegree1.id||item.id==100);
        };

        $scope.filterDegree2 = function(item){
          return (!($scope.application.selectdegree2&&$scope.application.selectdegree2.id)||item.id!=$scope.application.selectdegree2.id||item.id==100);
        };
        $scope.filterDegree3 = function(item){
          return (!($scope.application.selectdegree3&&$scope.application.selectdegree3.id)||item.id !=$scope.application.selectdegree3.id||item.id==100);
        };
        $scope.degrees = [
            {
                id:1,
                name: 'PhD'
            },
            {
                id:2,
                name: 'Masters'
            },
            {
                id:3,
                name: 'BTech'
            },
            {
                id:100,
                name: 'None'
            }
        ];

        $scope.pageChanged = function() {
            //alert('Page changed to: ' + $scope.pagination.currentPage);
            //$scope.pagination.currentPage = page;
            var begin = (($scope.pagination.currentPage - 1) * $scope.numPerPage);
            //var end = begin + $scope.numPerPage;
            $scope.getPatents(begin)
        };


    }]);
})();
$stateProvider
    .state('login', {
        url: "/login",
        templateUrl: 'pages/login.html',
        controller: 'LoginController',
        data: {
            requireLogin: false
        }
    })

    .state('app', {
        abstract: true,
        url: '/app',
        templateUrl: 'views/app.html',
        data: {
            requireLogin: true
        }
    })

    .state('app.dashboard', {
        url: '/dashboard',
        controller: 'DashboardCtrl',
        templateUrl: 'pages/map.html',
        data: {
            requireLogin: true
        }
    });