Question

我是angularJS的新手。我有一个html头文件，我使用ng-include包含在所有其他html文件中。我有一个JS文件包含在头文件中。每当我点击该头文件的li元素时，应该调用该头文件的函数。但我认为JS文件本身没有被调用，因为我在alert box本身写了document ready但它没有调用。我已将js文件包含在正确的文件夹中。

header.html中

<html ng-app="header">
<script src="./js/header.js" type="text/javascript"></script>
<body ng-controller="maincontroller">
 <li ng-click="logout_off()"><i class="fa fa-sign-out fa-fw"></i> Logout</li>
</body>
</html>

Header.js

var header = angular.module('header', []);

header.controller('maincontroller', function($scope, $http) {
    angular.element(document).ready(function() {
        alert("HI");

        $scope.logout_off = function() {
            $http({
                method: 'POST',
                url: 'logout_service',
                dataType: 'json',

            }).sucess(function(data) {
                alert(data);
                window.location = 'index.html';

            })
        }
     });
});

Answer 1

您需要将控制器添加到HTML中。

尝试在标题html中添加ng-controller="maincontroller"。

编辑：确保在索引html中加载header.js脚本。

Answer 2

使用logout_off直接定义函数$scope。您无需使用document-ready，因此请将其删除。

使用

var header = angular.module('header', []);
header.controller('maincontroller', function($scope, $http) {
    //You don't need this function
    //angular.element(document).ready(function() {
    //    alert("HI");
    //});

    $scope.logout_off = function() {
      //Your code
    }
});

javascript文件没有包含在ng-header中

2 个答案: