代码之家  ›  专栏  ›  技术社区  ›  forethought

ngclick不会触发与其关联的函数吗?

  •  0
  • forethought  · 技术社区  · 8 年前

    我在使用ng click时遇到了问题。我已经向按钮添加了ng-click指令。它不会触发与ng click关联的函数。在Angular Batarang工具中,它表示函数未定义。

    我在普朗克尝试了这个问题。它确实有效。而且,如果我硬编码文件路径,它会工作。

    指数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>
    

    应用程序。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);
            }
    
    
    }]);
    
    1 回复  |  直到 8 年前
        1
  •  5
  •   Martijn Welker    8 年前

    您在 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>