2013-06-06 13 views
6

Przeprowadzka w ramach AngularJS, pojawia się błąd JavaScript na poniższej linii // ERROR.Nie można ustawić właściwości niezdefiniowanego członka

Dlaczego otrzymuję 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> 

Odpowiedz

10

Nigdy nie definiujesz $scope.menuState. Zamiast rozważać:

<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

tylko pracy przez tę samą książkę i natknąłem się na ten temat. Myślałam, dodam, że następujących robót, a także:

<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

Właśnie natknąłem tej samej kwestii w trakcie czytania. Niejednoznaczność, której pierwsza odpowiedź nie wyjaśniła w rzeczywistości, polegała na tym, że użyła ona podkreślenia, ale w tym przypadku stworzyła zmienną pod obiektem zasięgu, podczas gdy operator kropki ustawiał niezadeklarowaną zmienną. Ta odpowiedź wydawała się lepiej odzwierciedlać poprawienie tej drugiej sytuacji. Dzięki – tsurantino

6

erratę przedstawia korektę: 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

Dziękujemy za udostępnienie linku. Rozwiązałem problemy w miarę ich odnajdywania (co do tej pory było prawie na każdej stronie). To dobra książka, ale zawiera wiele błędów. –

Powiązane problemy