Question

我编写了一个代码，用于向文本框下方的页面添加消息。文本框有一个添加按钮。一旦我在textbx中写了一条消息，然后点击添加，该消息应出现在下一行。我已经使用ng-repeat重复添加消息的过程，只要单击添加按钮。但是我收到错误消息 - 表达式'addMessage（）'是不可赋值的。和错误 - angular.js：13283 ReferenceError：未定义消息。请帮我解释一下代码。

<html ng-app="Swabhav.Message">

<head>
  <title>message-app</title>
  <script src="angular.js"></script>
  <link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" type="text/css"/>
  <script src="//cdnjs.cloudflare.com/ajax/libs/angular.js/1.2.20/angular.min.js"></script>
  <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
  <script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.2.0/js/bootstrap.min.js"></script>

</head>

<body>
<div ng-controller="MessageAdd">
  <h3>To Add Message:</h3>
  <input text="text" ng-model="addMessage()">
  <li ng-repeat="mess in message">
    <button type="button" ng-click="addMessage()">Add</button>
  </li>

  <br>
  <li><p> {{mess}}</li>
  </p><br>

</div>

<script>

  angular.module("Swabhav.Message", [])
    .controller("MessageAdd", ["$scope", function($scope) {

      $scope.message = [];

      $scope.addMessage = function() {
        $scope.message.push(message);
      };
    }]);

</script>

</body>

</html>

Answer 1

试一试：

<强> HTML

<body>
  <div ng-controller="MessageAdd">
    <h3>To Add Message:</h3>
    <input text="text" ng-model="messagetext">
    <button type="button" ng-click="addMessage()">Add</button>
    <li ng-repeat="mess in message">{{mess}}</li>
  </div>
</body>

<强>控制器：

angular.module("Swabhav.Message",[])
.controller("MessageAdd",["$scope",function($scope){
  $scope.messagetext = "";
  $scope.message=[];
  $scope.addMessage =function(){
    $scope.message.push($scope.messagetext);
    $scope.messagetext = "";
  }
}]);

Answer 2

你有一些错误。

首先，您无法为模型分配功能。您必须将模型的te值添加到消息数组中。然后你的按钮必须在ng-repeat之前，否则列表中的每个元素都会有一个按钮，而ng-repeat里面会有{{mess}}。

 <input text="text" ng-model="message">
       <button type="button" ng-click="addMessage()">Add</button>
       <ul>
          <li ng-repeat="mess in messages">
            {{mess}}
        </li>  
       </ul>

在你的控制器中，我会将数组重命名为消息，并为模型分配一个空数组。

$scope.messages=[];
$scope.message = "";

$scope.addMessage =function(){
  $scope.messages.push($scope.message);
  $scope.message = "";
}

尝试使用此代码并告诉我您是否正在尝试执行以及是否了解代码

Jsfddle

如何在angularjs1中添加文本框中的文本

2 个答案: