2016-03-31 1 views
0

У меня проблемы с использованием ng-click. Я добавил директиву ng-click на кнопку. Он не вызывает функцию, связанную с ng-click. В инструменте Angular Batarang указано, что функции не определены.ng-click не вызывает связанную с ним функцию?

Я пробовал проблему в 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); 
     } 


}]); 
+0

Не вдаваться в подробности, но жесткого кодирования пути к файлам звучит, как вам нужно '' -tag – Aides

+0

Кажется опечатка мне как 'div' закрыт и' нг-click' используется выражение, которое является из контекста ..https: //jsfiddle.net/t5qs0ta4/ – Rayon

ответ

5

Вы объявили функции внутри контроллера 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> 
+0

Отлично. Сейчас он работает как очарование. Желаю вам отличного дня. – forethought

Смежные вопросы