有时ng-click在Ionic中不起作用

Question

我是新的IONIC＆amp; AngularJS。目前，正在开发应用程序＆amp;陷入困境。不要如何解决这个问题。

我有一个登录表单。用户登录应用程序后，他/她将登陆HOME页面。在主页中，我有一张图片。在那张图片上，我正在使用ng-click。因此，在点击该图像时，它会将用户重定向到其他页面。在这里，我正面临着这个问题。问题就在登录后，当我进入主页时，点击该图像时，ng-click根本不起作用。但是，一旦我刷新浏览器＆amp;点击该图像ng-click开始工作。不知道为什么会发生这种有线的事情。

以下是我正在使用的所有文件。我在1.7.12中使用的离子版本

app.js

(function(){

    var app = angular.module('e2pro', ['ionic', 'e2pro.LoginController', 'e2pro.HomeController', 'e2pro.AttendanceController', 'e2pro.LogoutController','e2pro.MenuController','e2pro.EmpProfileController','e2pro.EmpSearchController', 'e2pro.VendorController', 'ngMessages', 'ngCordova', 'angularMoment']);

    var requestToken    = "";
    var accessToken     = "";
    var deviceToken     = null;
    var access_token    = null;
    var refresh_token   = null;
    var session_id      = null;
    var user_id         = null;
    var user_login_type = null;
    var route_to        = null;

    app.run(function($ionicPlatform, RequestsService, GeoAlert) {
        $ionicPlatform.ready(function() {
            // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
            // for form inputs)
            if (window.cordova && window.cordova.plugins.Keyboard) {
                cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
                cordova.plugins.Keyboard.disableScroll(true);
            }
            if (window.StatusBar) {
                // org.apache.cordova.statusbar required
                StatusBar.styleDefault();
            }

            console.log('inside app.run function');
        });

    });


    // Service for logout user from app
    app.factory("User", function($http, $q, $rootScope, $ionicHistory, $state) {
        return {
            logout: function(){
                window.localStorage.clear();
                $ionicHistory.clearCache();
                $ionicHistory.clearHistory();
                $ionicHistory.nextViewOptions({ disableBack: true, historyRoot: true });

                $state.go("login");
            }
        }
    });


    app.config(function($stateProvider, $urlRouterProvider, $httpProvider) {
        $stateProvider

        .state('app', {
            url: '/app',
            abstract: true,
            templateUrl: 'templates/menu.html',
            controller: 'MenuController'
        })

        .state('app.tabs', {
            url: "/tabs",
            views: {
                'menuContent': {
                    templateUrl: "templates/tabs.html",
                }
            }
        })

        .state('login', {
            url: "/login",
            templateUrl: "templates/login.html",
            //controller: 'LoginController'
        })

        .state('markEmpAttendance', {
            url: "/markEmpAttendance",
            templateUrl: "templates/attendance/markEmpAttendance.html",
            //controller: 'AttendanceController'
        })

        .state('app.tabs.home', {
            url: '/home',
            views: {
                'home-tab': {
                    templateUrl: 'templates/home.html',
                }
            }
        })

        .state('app.tabs.emp-profile', {
            url: '/emp-profile/:empId',
            views: {
                'home-tab': {
                    templateUrl: 'templates/empProfile.html',
                    //controller: 'EmpProfileController'
                }
            }
        })

        .state('app.tabs.vendor', {
            url: '/vendor',
            views: {
                'home-tab': {
                    templateUrl: 'templates/vendor/vendor.html',
                    //controller: 'EmpProfileController'
                }
            }
        })

        .state('app.tabs.emp-search', {
            url: '/emp-search',
            views: {
                'home-tab': {
                    templateUrl: 'templates/empSearch.html',
                    //controller: 'EmpProfileController'
                }
            }
        })

        .state('app.tabs.service-request', {
            url: "/articles",
            views: {
                'serviceRequest-tab': {
                    templateUrl: "templates/serviceRequest.html",
                    controller: 'articlesCtrl'
                }
            }
        })

        .state('app.tabs.colonies', {
            url: "/colonies",
            views: {
                'colonies-tab': {
                    templateUrl: "templates/colonies.html",
                    controller: 'coloniesCtrl'
                }
            }
        })

        .state('app.foo', {
            url: "/foo",
            views: {
                'menuContent': {
                    templateUrl: "templates/foo.html",
                    controller: 'fooCtrl'
                }
            }
        });

        $urlRouterProvider.otherwise('/app/tabs/home');
        $httpProvider.interceptors.push('sessionInjector');
    });

}());

login.js（控制器文件）

angular.module('e2pro.LoginController', [])

// Employee Attendance Controller
.controller('LoginController', function($http, $scope, $state, $ionicHistory, $ionicLoading, $cordovaOauth, RequestsService){
    console.log('Inside Login Controller');

    var baseUrl=null;

    $scope.credentials = {};
    $scope.validationFailed = false;

    $http.get('js/config.json')
            .then(function(res){
                baseUrl = res.data.server[res.data.mode];
            });


    // Method for user's default login
    $scope.validateCredentials = function(form){
        console.log('Form Validation start for login : '+form.$valid);
        var attendance_require = null;
        var emp_attendance_status = null;

        // Setting module data element for the api request
        $scope.credentials.module = 'user_login';
        $scope.credentials.pageId = 1548;

        // Check form validation status & move control accordingly
        if(!form.$valid)
        {
            return false;
        }

        // Show spinner animation
        $ionicLoading.show({
            template: '<ion-spinner icon="android"></ion-spinner>'
        });

        $http({
            method: 'POST',
            url: baseUrl+'/S/E2Pro_MobileApiEndPoint.php',
            data : $scope.credentials
        }).then(function successCallback(response) {
                if(response['data']['status'] === 'success')
                {
                    session_id    = response['data']['data']['session_id'];
                    user_id       = response['data']['data']['user_id'];
                    route_to      = response['data']['data']['route_to'];
                    attendance_require = response['data']['data']['attendance_require'];
                    emp_attendance_status = response['data']['data']['emp_attendance_status'];

                    window.localStorage.setItem("session_id", session_id);
                    window.localStorage.setItem("user_id", user_id);
                    window.localStorage.setItem("user_login_type", 'default');

                    // Hide Spinner before redirecting to home page
                    $ionicLoading.hide();

                    // Redirecting to home page
                    if(route_to === 'home'){
                        $state.go('app.tabs.home');
                        return false;
                    }
                }
                else
                {
                    // Hide Spinner before redirecting to home page
                    $ionicLoading.hide();

                    // Show message for email id & password miss match
                    $scope.validationFailed = true;
                }

            }, function errorCallback(response) {
                // console.log('Error occcur during user authentication');

                // Hide Spinner before redirecting to home page
                $ionicLoading.hide();
            });
    };

});

Home.js（控制器文件）

angular.module('e2pro.HomeController', [])

// Employee Attendance Controller
.controller('HomeController', function($scope, $state, $location, $ionicHistory, $ionicSideMenuDelegate, $http, $ionicPopup, User, GeoAlert){

    console.log('Inside Home Controller');
    var baseUrl=null;

    // Check application session. If it's found not exist redirect user to login page
    if(window.localStorage.getItem("session_id") === "undefined" || window.localStorage.getItem("session_id") === null) {
        $ionicHistory.nextViewOptions({
            disableAnimate: true,
            disableBack: true
        });

        $state.go("login");
        return false;
    }

    $scope.empName               = '';
    $scope.alertMsgBox           = false;
    $scope.alertMsgText          = '';
    $scope.employees             = [];

    $http.get('js/config.json')
            .then(function(res){
                baseUrl = res.data.server[res.data.mode];
            });

    // Method for showing Vendor page
    $scope.showVendorPage = function(){
        console.log('Clicked on vendor icon');
        $state.go('app.tabs.vendor');
    }

});

Home.html（模板文件）

<ion-view view-title="Home">
    <ion-content class="has-tabs">

        <div ng-controller='HomeController' >
            <div class="row" style="margin-top:15px;">
                <div class="col">
                    <img src="img/leave.png" ng-click="showVendorPage()">
                    <h5>Vendor</h5>
                </div>
                <div class="col">.col</div>
                <div class="col">.col</div>
            </div>
        </div>

    </ion-content>
</ion-view>