CODEWITHSUNDEEP
angularjs
unfoudev
unfoudev

Reputation: 87

Print array elements AngularJS

I would print a string with Angular variables.

<script>
var app = angular.module('monApp',[]);
app.controller('Controleur',function($scope){$scope.infos={
    "prenom": "Jean",
    "nom": "Dupont",
    "dateNaissance": new Date(1991,11,1)
    };
}


</script>

I would like to print Hello Jean Dupont born on "1991-11-30T23:00:00.000" I have tried many ways to print finded on web but no result.

<body data-ng-app="monApp" class ="ng-scope">
    <div data-ng-controller="Controleur" class ="ng-scope" ><p>Hello {{prenom}} {{scope.infos[1], born on {{scope.infos[2]}}</p></div>

</body></html>

Upvotes: 0

Views: 121

Answers (2)

Huy Chau
Huy Chau

Reputation: 2240

$scope.infos is a Object not Array, you should select to it with $scope.infos['propertyName'] or $scope.infos.propertyName

View:

<div ng-app="app">
  <div ng-controller="Controller">
    <p>Hello {{infos.prenom + ' ' + infos.nom + ', born on ' + infos.dateNaissance}}</p>
  </div>
</div>

Controller:

var app = angular.module('app', []);
app.controller('Controller', function($scope) {
  $scope.infos = {
    "prenom": "Jean",
    "nom": "Dupont",
    "dateNaissance": new Date(1991,11,1)
    };
});

See example: Here

Upvotes: 1

pwolaq
pwolaq

Reputation: 6381

you associate your data with scope infos variable, so a proper use would be:

<div data-ng-controller="Controleur" class ="ng-scope" ><p>Hello {{infos.prenom}} {{infos.nom}}, born on {{infos.dateNaissance}}</p></div>

tip: if your don't intend to change your data after inserting it, you can make use of Angular's one-time bindings, which will improve performance

<div data-ng-controller="Controleur" class ="ng-scope" ><p>Hello {{::infos.prenom}} {{::infos.nom}}, born on {{::infos.dateNaissance}}</p></div>

Upvotes: 2

Related Questions