Làm thế nào để đẩy đối tượng vào một mảng bằng AngularJS

Tôi đang cố gắng sử dụng chức năng đẩy góc nhưng nó không hoạt động.Làm thế nào để đẩy đối tượng vào một mảng bằng AngularJS

Tôi muốn thêm chuỗi (hoặc đối tượng) vào một mảng.

Tôi đã tìm kiếm các ví dụ cơ bản tại đây tại Stack Overflow nhưng tôi không thể tìm thấy nó.

Có ai có thể sửa mã của tôi hoặc viết một ví dụ rất cơ bản không?

Đây là ví dụ của tôi.

Đây là mã HTML:

<form ng-controller="TestController as testCtrl ng-submit="testCtrl.addText(myText)"> 
    <input type="text" value="Lets go"> 
    <button type="button">Add</button> 
</form>

Đây là mã Java Script:

(function() { 
    var app = angular.module('test', []); 

    app.controller('TestController', function() { 
     this.arrayText = { 
      text1: 'Hello', 
      text2: 'world', 
     } 

     this.addText = function(text) { 
      arrayText.push(this.text); 
     } 
    }); 
})();

Nguồn

2015-05-27 Roby Sottini

Không chắc chắn những gì bạn đang yêu cầu, nhưng 'this.arrayText' là một đối tượng, nó không có 'push', và nó không giống như chỉ' arrayText'? – adeneo

Đẩy chỉ làm việc cho mảng.

Tạo đối tượng arrayText của bạn cho đối tượng mảng.

Hãy thử Như thế này

this.arrayText = [{ 
    text1: 'Hello', 
    text2: 'world', 
}]; 

this.addText = function(text) { 
    this.arrayText.push(text); 
} 
this.form = { 
    text1: '', 
    text2: '' 
};

HTML

<div ng-controller="TestController as testCtrl"> 
    <form ng-submit="addText(form)"> 
    <input type="text" ng-model="form.text1" value="Lets go"> 
    <input type="text" ng-model="form.text2" value="Lets go again"> 
    <input type="submit" value="add"> 
    </form> 
</div>

Nguồn

2015-05-27 14:02:13

Loại nút phải được gửi. – User2

cảm ơn thông tin –

'Push' là dành cho mảng.

Bạn có thể làm một cái gì đó như thế này:

app.js:

(function() { 

var app = angular.module('myApp', []); 

app.controller('myController', ['$scope', function($scope) { 

    $scope.myText = "Let's go"; 

    $scope.arrayText = [ 
      'Hello', 
      'world' 
     ]; 

    $scope.addText = function() { 
     $scope.arrayText.push(this.myText); 
    } 

}]); 

})();

index.html

<!doctype html> 
<html ng-app="myApp"> 
    <head> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"></script> 
    <script src="app.js"></script> 
    </head> 
    <body> 
    <div> 
     <form ng-controller="myController" ng-submit="addText()"> 
      <input type="text" ng-model="myText" value="Lets go"> 
      <input type="submit" id="submit"/> 
      <pre>list={{arrayText}}</pre> 
     </form> 
    </div> 
    </body> 
</html>

Nguồn

2015-05-27 14:26:09 jreyes

Vui lòng kiểm tra này - http://plnkr.co/edit/5Sx4k8tbWaO1qsdMEWYI?p=preview

Controller-

var app= angular.module('app', []); 

app.controller('TestController', function($scope) { 
    this.arrayText = [{text:'Hello',},{text: 'world'}]; 

    this.addText = function(text) { 

     if(text) { 
     var obj = { 
      text: text 
     }; 
      this.arrayText.push(obj); 
      this.myText = ''; 
      console.log(this.arrayText); 
     } 
     } 
});

HTML

<form ng-controller="TestController as testCtrl" ng-submit="testCtrl.addText(testCtrl.myText)"> 
     <input type="text" ng-model="testCtrl.myText" value="Lets go"> 
     <button type="submit">Add</button> 
     <div ng-repeat="item in testCtrl.arrayText"> 
      <span>{{item}}</span> 
     </div> 
</form>

Nguồn

2015-05-27 14:49:42 User2

Một vài câu trả lời rằng nên làm việc trên nhưng đây là làm thế nào tôi sẽ viết nó.

Ngoài ra, tôi sẽ không khai báo bộ điều khiển bên trong mẫu. Tốt hơn là khai báo chúng trên các tuyến đường của bạn.

add-text.tpl.html

<div ng-controller="myController"> 
    <form ng-submit="addText(myText)"> 
     <input type="text" placeholder="Let's Go" ng-model="myText"> 
     <button type="submit">Add</button> 
    </form> 
    <ul> 
     <li ng-repeat="text in arrayText">{{ text }}</li> 
    </ul> 
</div>

app.js

(function() { 

    function myController($scope) { 
     $scope.arrayText = ['hello', 'world']; 
     $scope.addText = function(myText) { 
      $scope.arrayText.push(myText);  
     }; 
    } 

    angular.module('app', []) 
     .controller('myController', myController); 

})();

Nguồn

2015-05-28 04:06:01

Bạn nên cố gắng theo cách này. Nó chắc chắn sẽ hoạt động.

(function() { 

var app = angular.module('myApp', []); 

app.controller('myController', ['$scope', function($scope) { 

    $scope.myText = "Object Push inside "; 

    $scope.arrayText = [ 

     ]; 

    $scope.addText = function() { 
     $scope.arrayText.push(this.myText); 
    } 

}]); 

})();

Trong trường hợp của bạn $scope.arrayText là một đối tượng. Bạn nên khởi tạo như một mảng.

Nguồn

2016-07-27 14:11:52

var app = angular.module('myApp', []); 
 
     app.controller('myCtrl', function ($scope) { 
 

 
      //Comments object having reply oject 
 
      $scope.comments = [{ comment: 'hi', reply: [{ comment: 'hi inside commnet' }, { comment: 'hi inside commnet' }] }]; 
 

 
      //push reply 
 
      $scope.insertReply = function (index, reply) { 
 
       $scope.comments[index].reply.push({ comment: reply }); 
 
      } 
 

 
      //push commnet 
 
      $scope.newComment = function (comment) { 
 
       $scope.comments.push({ comment:comment, reply: [] }); 
 
      } 
 
     });

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 
<div ng-app="myApp" ng-controller="myCtrl"> 
 

 
     <!--Comment section--> 
 
     <ul ng-repeat="comment in comments track by $index" style="background: skyblue; padding: 10px;"> 
 
      <li> 
 
       <b>Comment {{$index}} : </b> 
 
       <br> 
 
       {{comment.comment}} 
 
       <!--Reply section--> 
 
        <ul ng-repeat="reply in comment.reply track by $index"> 
 
         <li><i>Reply {{$index}} :</i><br> 
 
          {{reply.comment}}</li> 
 
        </ul> 
 
       <!--End reply section--> 
 
       <input type="text" ng-model="reply" placeholder=" Write your reply." /><a href="" ng-click="insertReply($index,reply)">Reply</a> 
 
      </li> 
 
     </ul> 
 
     <!--End comment section --> 
 
      
 

 
     <!--Post your comment--> 
 
     <b>New comment</b> 
 
     <input type="text" placeholder="Your comment" ng-model="comment" /> 
 
     <a href="" ng-click="newComment(comment)">Post </a> 
 
    </div>

Nguồn

2016-09-23 17:18:33

Làm thế nào để đẩy đối tượng vào một mảng bằng AngularJS

Trả lời

Các vấn đề liên quan