Question

由于某些原因，我无法从视图中的控制器范围变量中检索数据。我的所有观点都使用相同的控制器，所以我不确定出了什么问题。任何帮助将不胜感激。

这是我的App.js

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


// Route configurations
app.config(['$routeProvider', function ($routeProvider){
$routeProvider.when('/', {
templateUrl: 'partials/home.html',
controller: 'MainController'
})
.when('/countries', {
templateUrl: 'partials/countriesList.html',
controller: 'MainController'
})
.when('/details', {
templateUrl: 'partials/countryDetails.html',
controller: 'MainController'
})
.otherwise({
 redirectTo: '/'
 });
}]);



// Main Controller Setup
app.controller('MainController', ['$scope', MainController]);
function MainController ($scope){
$scope.hello = 'hello';
}

以下是我尝试访问范围的视图之一：

<h1>Country List</h1>
<a href="#details"><button class="btn">Countries Details</button></a>

<p>hello: {{hello}}</p>

这是我的index.html

<!DOCTYPE html>
<html ng-app="app">
 <head>
  <title>Countries and Capitals</title>
  <link rel="stylesheet" type="text/css" href="css/vendor/bootstrap.min.css">
  <link rel="stylesheet" type="text/css" href="css/main.css">
 </head>
 <body ng-controller="MainController" ng-cloak>
  <div class="container">
    <div class="row">
      <div class="col-sm-12 text-center">
        <ng-view></ng-view>
      </div>
     </div>
   </div>


  <script src="js/vendors.js"></script>
  <script src="js/scripts.js"></script>
 </body>
</html>

Answer 1

由于嵌套范围而导致的问题。使用一些嵌套作用域的更好方法是使用controllerAs方法。你能尝试一下：

```

<body ng-controller="MainController as myctrl" ng-cloak>

<p>hello: {{myctrl.hello}}</p>

```

Answer 2

在ng-route中添加控制器时所执行的操作是创建同一控制器的另一个范围。我的建议是你使用无控制器，即删除控制器属性或添加$ parent。在您正在引用的视图中。

如果你想在一组页面上拥有相同的范围，那么第一个是首选的，当你为不同的页面设置不同的控制器时，第二个是首选。

如果你想访问全局变量，你可以将它们添加到$ rootScope并全局访问它们。

希望这有帮助

无法访问视图中的范围 - Angular

2 个答案: