2013-06-06 33 views
6

Di chuyển dọc theo AngularJS, tôi gặp phải lỗi JavaScript trên dòng // ERROR bên dưới.Không thể đặt thuộc tính của thành viên chưa được xác định

Tại sao tôi nhận được Cannot set property 'show' of undefined?

<html ng-app> 
<body> 

    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js"> 
     </script> 

    <div ng-controller='DeathrayMenuController'> 
     <button ng-click='toggleMenu()'>Toggle Menu</button> 
     <ul ng-show='menuState.show'> 
      <li ng-click='stun()'>Stun</li> 
      <li ng-click='disintegrate()'>Disintegrate</li> 
      <li ng-click='erase()'>Erase from history</li> 
     </ul> 
    <div/> 

    <script> 
    function DeathrayMenuController($scope) { 
     $scope.menuState.show = false;  // ERROR HERE 

     $scope.toggleMenu = function() { 
      $scope.menuState.show = !$scope.menuState.show; 
     }; 
    } 
    </script> 
</body> 
</html> 

Trả lời

10

bạn không bao giờ định nghĩa $scope.menuState. Thay vào đó, hãy xem xét:

<html ng-app> 
    <body> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js"></script> 
    <div ng-controller='DeathrayMenuController'> 
     <button ng-click='toggleMenu()'>Toggle Menu</button> 
     <ul ng-show='menuState_show'> 
     <li ng-click='stun()'>Stun</li> 
     <li ng-click='disintegrate()'>Disintegrate</li> 
     <li ng-click='erase()'>Erase from history</li> 
     </ul> 
    <div/> 

    <script> 
    function DeathrayMenuController($scope) { 
     $scope.menuState_show = false; 
     $scope.toggleMenu = function() { 
     $scope.menuState_show = !$scope.menuState_show; 
     }; 
    } 
    </script> 
    </body> 
</html> 
9

Chỉ cần làm việc qua cùng một cuốn sách và gặp phải vấn đề này. Nghĩ rằng tôi muốn thêm rằng các công việc sau khi tốt:

<html ng-app> 
<body> 

    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.1/angular.min.js"> 
     </script> 

    <div ng-controller='DeathrayMenuController'> 
     <button ng-click='toggleMenu()'>Toggle Menu</button> 
     <ul ng-show='menuState.show'> 
      <li ng-click='stun()'>Stun</li> 
      <li ng-click='disintegrate()'>Disintegrate</li> 
      <li ng-click='erase()'>Erase from history</li> 
     </ul> 
    <div/> 

    <script> 
    function DeathrayMenuController($scope) { 
     $scope.menuState = {show: false};  // ERROR HERE 

     $scope.toggleMenu = function() { 
      $scope.menuState.show = !$scope.menuState.show; 
     }; 
    } 
    </script> 
</body> 
</html> 
+2

Chỉ cần đi qua vấn đề này cùng khi đọc. Sự mơ hồ rằng câu trả lời đầu tiên không thực sự rõ ràng là nó chỉ sử dụng gạch dưới nhưng khi làm như vậy tạo ra một biến dưới đối tượng phạm vi, trong khi toán tử dấu chấm đã thiết lập một biến không khai báo. Câu trả lời này dường như phản ánh đúng hơn việc khắc phục tình trạng sau này. Cảm ơn – tsurantino

6

Các Errata cho thấy việc sửa: http://oreilly.com/catalog/errata.csp?isbn=0636920028055

$scope.menuState.show = false; will give an undefined error 

Added $scope.menuState = {} before to fix the issue i.e. 

function DeathrayMenuController($scope) { 
    $scope.menuState = {} 
    $scope.menuState.show = false; 
... 
+0

Cảm ơn bạn đã chia sẻ liên kết. Tôi đã giải quyết các vấn đề như tôi tìm thấy chúng (mà đã được khá nhiều mỗi trang cho đến nay). Đó là một cuốn sách hay, nhưng nó chứa rất nhiều lỗi. –

Các vấn đề liên quan