Question

我是AngularJS的新手。我创建了一个简单的场景来开始学习，但由于某种原因，下面的代码不起作用：

var app = angular.module("myModule", []).controller("myController", function($scope) {
    $scope.addIneger = function (a, b) {
        alert();
        $scope.output= a + b;
    }
});

这是我的HTML代码：

<html>
<head>
  <Script src="javascript/angular.js"> </Script>
  <Script src="javascript/script.js"> </Script>
  <title>Insert title here</title>
</head>
<body ng-app="myModule">
  <table ng-cntroller="myController">
    <th>
      <td><input type="text" ng-model="a"/></td>
      <td><input type="text" ng-model="b"/></td>
    </th>
    <th>
        <td><input type="text" ng-model="output"/></td>
    </th>
    <th>
      <td>
        <button type="button" ng-click="addIneger(a,b)" />
      </td>
   </th>
 </table>

如您所见，2个文本框获取数字，单击按钮后，结果将显示。

有人可以帮忙吗？

Answer 1

您输入了语法错误/拼写错误：

<table ng-cntroller="myController">

将其更改为：

<table ng-controller="myController">

对于其他人来说，你正在做的事情很有效，除了你没有添加数字而是字符串，因为你在type="text"上使用了input：

<input type="text" ng-model="a" />
<input type="text" ng-model="b" />

因此，当您添加它时，它会将两个值"2" + "3" = "23"连接起来。您需要将输入更改为type="number"：

 <input type="number" ng-model="a" /><br>
 <input type="number" ng-model="b" /><br>

或者将您的值转换为方法中的数字：

$scope.addInteger = function (a, b) {
    $scope.output= new Number(a) + new Number(b);
}

// or

$scope.addInteger = function (a, b) {
    $scope.output= parseInt(a) + new parseInt(b);
}

完美运作：

angular.module('App', []);

angular.module('App').controller('Controller', [
             '$scope',
    function ($scope) {
        $scope.addInteger = function (a, b) {
            $scope.output= a + b;
        }
    }
]);

<!DOCTYPE html>
<html ng-app="App">
    <head>
        <script type="application/javascript" src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.5.0/angular.js"></script>
    </head>
    <body ng-controller="Controller">
        <input type="number" ng-model="a" /><br>
        <input type="number" ng-model="b" /><br>
        <button type="button" ng-click="addInteger(a,b)">
            Add integer
        </button><br>
        <input type="text" ng-model="output" /><br>
    </body>
</html>

Answer 2

您可以更改以下代码。问题应该是，当addIneger（a，b）调用它时，它不会发送a和b的值。

var app=angular.module("myModule",[]).controller("myController", function($scope){
    $scope.addIneger=function(){
    alert();
    $scope.output= $scope.a+$scope.b;
    }
    });

<html>
<head>
 <Script src="javascript/angular.js"> </Script>
 <Script src="javascript/script.js"> </Script>
 <title>Insert title here</title>
</head>
<body ng-app="myModule">
<table ng-cntroller="myController">
<th>
     <td><input type="text" ng-model="a"/></td>
    <td><input type="text" ng-model="b"/></td>
     </th>
    <th>
        <td><input type="text" ng-model="output"/></td>
    </th>
        <th>
     <td>

      <button type="button" ng-click="addIneger()" />

     </td>
   </th>
  </table>
    </body>
     </html>

Answer 3

尝试使用以下代码：

$scope.output = parseInt(a) + parseInt(b);

angularjs函数不会被调用

3 个答案: