访问全局变量

Accessing global variables

本文关键字：全局变量 访问      更新时间：2023-09-26

我正试图在angularjs项目中设置一个根作用域，这样我就可以从HTML中的任何位置访问名称（而不是在ng视图中）。

<!DOCTYPE html>
<html lang="en" ng-app="phonecatApp" ng-controller="ApplicationController">
</html>

它封装了整个页面的

我在一个名为app.js的js文件中加载了以下内容；

var phonecatApp = angular.module('phonecatApp', []);
phonecatApp.factory('UserService', function(){
    return {
        name : 'Tom'
    };
})
function ApplicationController($scope, UserService){
    $scope.username = UserService.name
}

我正在尝试在index.html中做以下操作：

<a href="#index" class="nav-item name_p_nav">{{username}}</a>

但它只是返回空白

编辑：修复打字错误

您可以尝试这样的方法。更改您声明控制器的方式。为了使用$scope变量，你必须声明它，可能你应该收到脚本错误，因为它没有声明，请使用开发人员工具在浏览器中检查以找出确切的错误。

phonecatApp.controller('ApplicationController',['$scope',function ($scope){
 $scope.username = UserService.name

}])；

我试图重现这个问题，我很快创建了一个应用程序，它对我很有效！在这里，我发布了我的示例代码，只是看一下相同的代码。

<html lang="en" ng-app="phonecatApp" ng-controller="ApplicationController">
<head>
    <script src="../Scripts/lib/angular.min.js"></script>
    <script src="../Scripts/Application1.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0rc1/angular-route.min.js"></script>
</head>
<body>
    <a href="#index" class="nav-item name_p_nav">{{username}}</a> 
</body>

脚本：

var phonecatApp = angular.module('phonecatApp', []);
phonecatApp.factory('UserService', function(){
return {
        name : 'Tom'
};
})
function ApplicationController($scope, UserService){
$scope.username = UserService.name
}
相关文章：