爲什麼這個$適用於指令是拋出值未定義錯誤

我正在嘗試使用角度js編寫一個指令，其中按鈕單擊必須增加count值。

在點擊事件處理程序中，我試圖使用scope.$apply構造增加值，但它在控制檯中拋出Syntax Error: Token 'undefined' not a primary expression at column NaN of the expression [count++] starting at [count++]錯誤。

標記

<div ng-app="myApp"> 
    <div ng-controller="MainCtrl"> 
     <div my-directive > 
     </div> 
    </div> 
</div>

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

myApp.directive('myDirective', function(){ 
    return { 
     scope: {}, 
     template: '<div>{{count}}</div><input type="button" class="increment" value="Increment" />', 
     link: function(scope, iElement, iAttrs, controller) { 
      console.log('link', scope.count) 
      iElement.on('click', '.increment', function(){ 
       console.log('click', scope.count); 
       scope.$apply('count++'); 
      }) 
     }, 
     controller: function($scope){ 
      console.log('controller') 
      $scope.count = 0; 
     } 
    }; 
}); 

myApp.controller('MainCtrl', ['$scope', function($scope){ 
}]);

演示：Fiddle

來源

2013-02-15 Arun P Johny

改變你的表達

count = count + 1

解決了這個問題。演示：Fiddle

由於Angular不使用eval來評估表達式，所以不能在其中使用完整的JavaScript範圍;這是這些例外之一。如果您做需要一些更強大的，你可以通過一個JavaScript函數來$apply（演示：Fiddle）：

scope.$apply(function() { 
    scope.count++; 
});

來源

2013-02-15 07:07:42

爲什麼不直接使用ng-click？

<body ng-controller='MainCtrl'> 
    <button ng-click="increment()" value="Increment Me!"> 
    <h1>{{count}}</h1> 
</body>

而在你的JS：

function MainCtrl($scope) { 
    $scope.count = 0; 
    $scope.increment = function() { $scope.count++; }; 
}

來源

2013-02-15 07:08:06 satchmorun

爲什麼這個$適用於指令是拋出值未定義錯誤

回答

相關問題