Question

我一定很遗憾。我得到错误$ scope未在plunker中定义。错误在哪里？我已经声明了模块，控制器和依赖项，我无法看到错误的位置。

    var phonecatApp = angular.module('phonecatApp', [$scope]);

phonecatApp.controller('PhoneListCtrl', function () {
  $scope.phones = [
    {'name': 'Nexus S',
     'snippet': 'Fast just got faster with Nexus S.',
     'age': 1},
    {'name': 'Motorola XOOM™ with Wi-Fi',
     'snippet': 'The Next, Next Generation tablet.',
     'age': 2},
    {'name': 'MOTOROLA XOOM™',
     'snippet': 'The Next, Next Generation tablet.',
     'age': 3}
  ];

  $scope.orderProp = 'age';
});

    <html ng-app='phonecatApp'>
    <head>
      <title>My Angular App</title>
      <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0/angular.min.js"></script>
      <script src="script.js"></script>
    </head>
    <body>
    <div ng-controller="PhoneListCtrl">Search: <input ng-model="query">
  Sort by:
  <select ng-model="orderProp">
    <option value="name">Alphabetical</option>
    <option value="age">Newest</option>
  </select>


  <ul class="phones">
    <li ng-repeat="phone in phones | filter:query | orderBy:orderProp">
      <span>{{phone.name}}</span>
      <p>{{phone.snippet}}</p>
    </li>
  </ul></div>
    </body>
  </html>

Answer 1

您必须在控制器声明中注入$scope

phonecatApp.controller('PhoneListCtrl', function ($scope) {

缩小安全版：

phonecatApp.controller('PhoneListCtrl', ["$scope", function ($scope) {

Answer 2

尝试在控制器中注入范围：

phonecatApp.controller('PhoneListCtrl', function ($scope) {
  $scope.phones = [
    {'name': 'Nexus S',
     'snippet': 'Fast just got faster with Nexus S.',
     'age': 1},
    {'name': 'Motorola XOOM™ with Wi-Fi',
     'snippet': 'The Next, Next Generation tablet.',
     'age': 2},
    {'name': 'MOTOROLA XOOM™',
     'snippet': 'The Next, Next Generation tablet.',
     'age': 3}
  ];

  $scope.orderProp = 'age';
});

如果您按照以下方式定义控制器后跟模块声明会更好：

angular.module('phonecatApp').controller('PhoneListCtrl', ['$scope', 
function($scope) {
}]);

工作人员：

http://plnkr.co/edit/rn1apoWd9of0VHyz6SYO?p=preview

$ scope未定义

2 个答案: