ng-click 不会触发与之关联的功能吗?
ng-click does not trigger the function associated with it?
我在使用 ng-click 时遇到了问题。我已将 ng-click 指令添加到按钮。它不会触发与 ng-click 关联的功能。在 Angular Batarang 工具中,它表示函数未定义。
我试过 Plunker.It 中的问题确实有效。而且,如果我对文件路径进行硬编码,它就可以工作。
index.html代码
<!DOCTYPE html>
<HTML ng-app="myEventApp">
<head>
<meta charset="UTF-8">
</head>
<body>
<h1 ng-controller="HelloWorldController">{{ helloMessage }}</h1>
<div ng-controller="EventDetail">
</div>
<div ng-include="" src="fileName"></div>
<!--<ng-include src="fileName"></ng-include>-->
<!--<div ng-include="" src="'template/testing10000.html'"></div>-->
<button ng-click=incrementCounter()>Next</button>
<button ng-click=decrementCounter()>Back</button>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0/angular.js"></script>
<script src="js/app.js"> </script>
</body>
</HTML>
app.js代码
var app = angular.module("myEventApp", []);
app.controller('HelloWorldController', ['$scope', function($scope){
$scope.helloMessage = "Book Viewer";
}]);
app.controller('EventDetail', ['$scope', function($scope){
$scope.counter = 0;
$scope.fileName = 'template/testing1000'+$scope.counter+'.html';
$scope.incrementCounter = function(){
$scope.counter++;
$scope.fileName = 'template/testing1000'+$scope.counter+'.html';
console.log($scope.counter);
}
$scope.decrementCounter = function(){
$scope.counter--;
$scope.fileName = 'template/testing1000'+$scope.counter+'.html';
console.log($scope.counter);
}
}]);
您在 EventDetail
控制器中声明了函数,但在 html 中的控制器容器外部有按钮。
<div ng-controller="EventDetail">
<div ng-include="" src="fileName"></div>
<button ng-click="incrementCounter()">Next</button>
<button ng-click="decrementCounter()">Back</button>
</div>
我在使用 ng-click 时遇到了问题。我已将 ng-click 指令添加到按钮。它不会触发与 ng-click 关联的功能。在 Angular Batarang 工具中,它表示函数未定义。
我试过 Plunker.It 中的问题确实有效。而且,如果我对文件路径进行硬编码,它就可以工作。
index.html代码
<!DOCTYPE html>
<HTML ng-app="myEventApp">
<head>
<meta charset="UTF-8">
</head>
<body>
<h1 ng-controller="HelloWorldController">{{ helloMessage }}</h1>
<div ng-controller="EventDetail">
</div>
<div ng-include="" src="fileName"></div>
<!--<ng-include src="fileName"></ng-include>-->
<!--<div ng-include="" src="'template/testing10000.html'"></div>-->
<button ng-click=incrementCounter()>Next</button>
<button ng-click=decrementCounter()>Back</button>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0/angular.js"></script>
<script src="js/app.js"> </script>
</body>
</HTML>
app.js代码
var app = angular.module("myEventApp", []);
app.controller('HelloWorldController', ['$scope', function($scope){
$scope.helloMessage = "Book Viewer";
}]);
app.controller('EventDetail', ['$scope', function($scope){
$scope.counter = 0;
$scope.fileName = 'template/testing1000'+$scope.counter+'.html';
$scope.incrementCounter = function(){
$scope.counter++;
$scope.fileName = 'template/testing1000'+$scope.counter+'.html';
console.log($scope.counter);
}
$scope.decrementCounter = function(){
$scope.counter--;
$scope.fileName = 'template/testing1000'+$scope.counter+'.html';
console.log($scope.counter);
}
}]);
您在 EventDetail
控制器中声明了函数,但在 html 中的控制器容器外部有按钮。
<div ng-controller="EventDetail">
<div ng-include="" src="fileName"></div>
<button ng-click="incrementCounter()">Next</button>
<button ng-click="decrementCounter()">Back</button>
</div>