AngularJS NG-点击不起作用

这里是我的代码（我已添加角）：AngularJS NG-点击不起作用

<body ng-app="clickExample" ng-controller="ExampleController" ng-init="choice = 1"> 
    <script> 
    var app = angular.module("clickExample", []); 
    app.controller('ExampleController', ['$http', '$scope', function ($http, $scope) { 
     $scope.apiCall = function() { 
      alert('ciao'); 
     }; 
    }]); 
    </script> 
    <div> 
     <button ng-click="apiCall()">Ciao</button> 
    </div> 
</body>

编辑：这里是整个HTML（我也有一个样式表和其他JS库，但我不认为他们是相关的）。

<html> 

<head> 
    <title>Network | Social Network</title> 
    <style> 
     body { 
      font: 10pt arial; 
     } 

     #mynetwork { 
      width: 600px; 
      height: 600px; 
      border: 1px solid lightgray; 
      background: #F3F3F3; 
     } 
    </style> 
    <script type="text/javascript" src="vis.js"></script> 
    <script type="text/javascript" src="jquery-3.1.0.min.js"></script> 
    <script type="text/javascript" src="apiLogic.js"></script> 
    <script type="text/javascript" src="myModule.js"></script> 
    <script type="text/javascript" src="angular.min.js"></script> 
    <link href="vis.css" rel="stylesheet" type="text/css"> 
    <link href="stileTabs.css" rel="stylesheet" type="text/css"> </head> 

<body ng-app="clickExample" ng-controller="ExampleController" ng-init="choice = 1"> 
    <script> 
     var app = angular.module("clickExample", []); 
     app.controller('ExampleController', ['$http', '$scope', function ($http, $scope) { 
      $scope.showAlert = function() { 
       alert("This is an example of ng-click"); 
      }; 
      $scope.apiCall = function() { 
       alert('ciao'); 
      }; 
    }]); 
    </script> 
    <div ng-class="{selected: choice == 1, unselected: choice != 1}"> 
     <button class="tab" type="button" ng-click="choice=1">Cerca per nome</button> 
    </div> 
    <div ng-class="{selected: choice == 2, unselected: choice != 2}"> 
     <button class="tab" type="button" ng-click="choice=2">Cerca per ID</button> 
    </div> 
    <div ng-class="{selected: choice == 3, unselected: choice != 3}"> 
     <button class="tab" type="button" ng-click="choice=3">Rankings</button> 
    </div> 
    <div id="info" ng-show="choice==1"> Nome: 
     <input type="text" id="nodeNameTxt"> 
     <br/> Data: 
     <input type="text" id="dateTxt"> 
     <br/> 
     <button type="button" onclick="gnbn()">Cerca nodo</button> 
     <br/> </div> 
    <div ng-show="choice==2"> Id: 
     <input type="text" id="nodeIdTxt"> 
     <br/> Data: 
     <input type="text" id="dateIdTxt"> 
     <br/> 
     <button type="button" onclick="gnbid()">Cerca nodo</button> 
     <br/> </div> 
    <div ng-show="choice==3"> Limite: 
     <input type="text" id="rankLimitTxt"> 
     <br/> Data: 
     <input type="text" id="rankDateTxt"> 
     <br/> 
     <button type="button" onclick="grank()">Ottieni classifica</button> 
     <br/> 
     <button ng-click="ExampleController.apiCall()">Ciao</button> 
    </div> 
    <div id="mynetwork" ng-hide="choice==3"> 
     <div class="vis network-frame" style="position: relative; 
       overflow: hidden; 
       -webkit-user-select: none; 
       touch-action: pan-y; 
       -webkit-user-drag: none; 
       -webkit-tap-highlight-color: rgba(0, 0, 0, 0); 
       width: 100%; 
       height: 100%;"> 
      <canvas width="1000" height="600" style="position: relative; 
         -webkit-user-select: none; 
         touch-action: pan-y; 
         -webkit-user-drag: none; 
         -webkit-tap-highlight-color: rgba(0, 0, 0, 0); width: 100%; 
         height: 100%;"> </canvas> 
     </div> 
    </div> 
</body> 

</html>

当我点击按钮什么都没有发生，我做错了什么？

来源

2016-07-27 leqo

角版本使用 –

具有负载agular.js在你的页面？ –

'app.controller（'ExampleController'，['$ http'，'$ scope'，function（$ http，$ scope）{'控制器中参数的顺序 - 您首先注入'$ http'服务，然后注入'$范围' –

-1

其工作，从您的NG-点击，删除ExampleController

正确：<button ng-click="apiCall()">Ciao</button>

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<body ng-app="clickExample" ng-controller="ExampleController" ng-init="choice = 1"> 
 
    <script> 
 
    var app = angular.module("clickExample", []); 
 
    app.controller('ExampleController', ['$http', '$scope', function ($http, $scope) { 
 
     $scope.apiCall = function() { 
 
      alert('ciao'); 
 
     }; 
 
    }]); 
 
    </script> 
 
    <div> 
 
     <button ng-click="apiCall()">Ciao</button> 
 
    </div> 
 
</body>

来源

2016-07-27 11:30:59

我添加了整个代码 – leqo

这不起作用 – leqo

。删除示例控制器从ng点击 –

您应该添加$ HTTP在app.controller

<body ng-app="clickExample" ng-controller="ExampleController" ng-init="choice = 1"> 
    <script> 
    var app = angular.module("clickExample", []); 
    app.controller('ExampleController', ['$http', '$scope', function ($http, $scope) { 
     $scope.apiCall = function() { 
      alert('ciao'); 
     }; 
    }]); 
    </script> 
    <div> 
     <button ng-click="apiCall()">Ciao</button> 
    </div> 
</body>

来源

2016-07-27 11:28:41

为什么这是被投票？ –

我发现了错误。

把角色脚本导入后脚本...因为你在导入角色之前试图使用角度。

例如：

<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script> 
<script> 
var app = angular.module('clickExample', []); 
app.controller('ExampleController', ['$http', '$scope', function ($http,$scope) { 
    $scope.apiCall = function() { 
     alert('ciao'); 
    }; 
}]); 
</script>

它会使你的代码工作。

来源

2016-07-27 11:28:56

他已经指定他添加了角 –

现在我 –

AngularJS NG-点击不起作用

回答

相关问题