Question

为什么这段代码会出错？我收到错误＆＃34;无法设置属性＆＃39;显示＆＃39;未定义＆＃34;

<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/>

function DeathrayMenuController($scope) {
$scope.menuState.show = false;
$scope.toggleMenu = function() {
$scope.menuState.show = !$scope.menuState.show;
};
// death ray functions left as exercise to reader
}

Answer 1

如果show为$scope.menustate，则无法在$scope.menustate上设置undefined属性。您需要先将其初始化：

$scope.menuState = {};
$scope.menuState.show = false;

或者：

$scope.menuState = {
    show: false
};

Answer 2

您要将show属性分配给$scope.menuState对象，但您没有$scope.menuState个对象，

所以你需要做的是，在控制器的开头创建一个$scope.menuState对象，

function DeathrayMenuController($scope) {
   $scope.menuState = {};           // initialize the object first.
   $scope.menuState.show = false;
   $scope.toggleMenu = function() {
       $scope.menuState.show = !$scope.menuState.show;
   };
   // death ray functions left as exercise to reader
}

Answer 3

您首先没有定义$ scope.menuStage。试试这个：

<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/>

function DeathrayMenuController($scope) {
$scope.menuState_show = false;
$scope.toggleMenu = function() {
$scope.menuState_show = !$scope.menuState_show;
};
// death ray functions left as exercise to reader
}

ng-show in angular会给出错误

3 个答案: