angularjs - What is the reason html showing variable names client side in Angular.js? -
my application contains below data
"countries = [ {locale:'en-us',name:'united states'}, {locale:'en-gb',name:'united kingdom'}, {locale:'en-fr',name:'france'}]"
and have written html code
<li ng-repeat = "country in countries"> {{ 'country: ' + country.name + ', locale: ' + country.locale }} </li>
as output showing:
list of countries locale:
home.html file
<html> <head> <title>angularjs first application</title> </head> <script src = "http://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"> </script> <body> <div ng-app = "" ng-init= "countries:[ {locale:'en-gb',name:'united kingdom'}, {locale:'en-us',name:'united state'}, {locale:'en-fr',name:'france'}]; quantity = 1;cost = 30;" > <p>list of countries locale:</p> <ol> <li ng-repeat = "country in countries"> {{ 'country: ' + country.name + ', locale: ' + country.locale }} </li> </ol> </div> </body> </html>
why not showing countries name in list?
the issue in ng-init....
you have:
<div ng-app = "" ng-init= "countries:[ {locale:'en-gb',name:'united kingdom'}, {locale:'en-us',name:'united state'}, {locale:'en-fr',name:'france'}]; quantity = 1;cost = 30;" >
where should be:
// changed countries:[ // to: countries=[ <div ng-app = "" ng-init= "countries=[ {locale:'en-gb',name:'united kingdom'}, {locale:'en-us',name:'united state'}, {locale:'en-fr',name:'france'}]; quantity = 1;cost = 30;" >
working plnkr
Comments
Post a Comment