作用域变量不打印AngularJS

Scope variable not printing AngularJS

本文关键字：AngularJS 打印 变量 作用域      更新时间：2023-09-26

我开始用AngularJS构建我的第一个单页应用程序，我被一个简单的问题卡住了。我希望能够设置范围变量"标题"answers"副标题"改变页面头每次用户点击一个"链接"。在主索引页上，它应该显示的html看起来像这样:

<div id="header">
    <h1>{{title}}</h1>
    <h3>{{subtitle}}</h3>
</div>

在app.js文件中，我正在做我所有的路由，我有多个控制器得到应用取决于url。每个控制器看起来像这样:

app.controller('displayCtrl', function($scope, $http) {
    $scope.title = "Machine Profiles";
    $scope.subtitle = "Add, remove, and view data about machines";
    console.log($scope.title);
});

正如您所看到的，我将刚刚设置的变量输出到控制台，它实际上显示了正确的内容。问题是h1和h3标签没有显示作用域变量!我的标题和副标题在标题是空白的，即使范围变量正在设置和记录。在页面加载或单击链接时，我在控制台中没有得到任何错误。我在routeProvider中加载的'templateUrl'也在主容器中的所有部分页面上显示内容。只是标题坏了。请帮助。提前感谢

<div id="header">在您的ng-view之外吗?

如果是-，说明<div id="header">不在displayCtrl的作用范围内。

尝试更新$rootScope而不是$scope。

app.controller('displayCtrl', function($scope, $rootScope, $http) {
    $rootScope.title = "Machine Profiles";
    $rootScope.subtitle = "Add, remove, and view data about machines";   
});

确保<div id="header">在ng-app里面

请确保你已经将angular绑定到你的html页面。

试着看看这个例子

您也可以尝试重新格式化控制器，如下所示。Angular推荐内联注入注释

app.controller('displayCtrl', ['$scope','$http', function($scope, $http) {
    $scope.title = "Machine Profiles";
    $scope.subtitle = "Add, remove, and view data about machines";
    console.log($scope.title);
}]);
相关文章：