mvmthecreator mvmthecreator - 11 days ago 10
AngularJS Question

Angularjs push array to scope

I have problems to push an array to scope and empty the array after that.

I fire up the function

ng-click="addInput()
to add a new form to the Array
$scope.info.sites = [];
wich contains an another array
meta_keys:$scope.tags
.

If i click the
ng-click="addInput()
again the form will be generated but is filled in with data already. Means the same values on every meta_keys:$scope.tags. I think i need to empty the array before generate new.
Or i am on the wrong way. thanks for help.

codepen.io


html


<div ng-app="myApp" ng-controller="myCtrl">
{{name}}

<form>
<div class="form-group">
<label for="txtDevice" class="control-label">Domain Name:</label>
<input type="text" class="form-control" ng-model="info.name" id="txtDevice">
</div>
<div class="form-group">
<label for="txtIP" class="control-label">IP Address:</label>
<input type="text" class="form-control" ng-model="info.ip" id="txtIP">
</div>
<div class="form-group">
<label for="txtUsername" class="control-label">Logo:</label>
<input type="text" class="form-control" ng-model="info.logo" id="txtLogo">
</div>

<div class="form-group" ng-repeat="site in info.sites track by $index">
<h4>Seite {{$index+1}}</h4>
<label type="txt" class="control-label">Title</label>
<input type="txt" class="form-control" ng-model="site.site_title" /><br />
<label type="txt" class="control-label">Desc</label>
<input type="text" class="form-control" ng-model="site.meta_desc"><br />
<label type="txt" class="control-label">Meta Keys</label>
<!-- <input type="text" class="form-control" ng-model="site.meta_keys"> -->
<tags-input ng-model="tags" ></tags-input>
</div>

</form>
<button ng-click="addInput()">+add more inputs</button>
{{info | json}}
<hr>


tags = {{tags | json}}

</div>



script.js


angular.module('myApp', ['ngTagsInput'])
.controller('myCtrl', function($scope, $http){
$scope.name ="myName" ;
$scope.info = {};
$scope.info.sites = [];
$scope.tags = [];


$scope.addInput = function() {
//$scope.tags = [];
$scope.info.sites.push({
site_title:'',
meta_desc:'',
meta_keys:$scope.tags})

}
// $scope.info.sites.meta_keys = [];

});

Answer

Just replace the line

<tags-input ng-model="tags" ></tags-input>

with

<tags-input ng-model="site.tags" ></tags-input>

I hope, it helps :)

Comments