AngularJS bind elements inside a loop

Question

I have this loop to show a list of input text

<div ng-repeat="country in countries">
  <input ng-blur="saveCountryName(country)" type="text" value="{{country.name}}">
</div>

in my controller

$scope.saveCountryName = (country) => {
  console.log(country);
}

country is filled with the original value, how can I get the modified value?

Instead of value="{{country.name}}" try using ng-model="{{country.name}}" — AvgustinTomsic
– AvgustinTomsic, Commented Oct 20, 2022 at 10:36

Shevchenko Viktor · Accepted Answer · 2022-10-20 13:34:25Z

1

In AngularJS you have all power of two-way data binding, no need to use a special function (saveCountryName).

<div ng-repeat="country in countries">
  <input type="text" ng-model="country.name" ng-model-options="{ updateOn: 'blur'}" />
</div>

answered Oct 20, 2022 at 13:34

Shevchenko Viktor

5,4262 gold badges19 silver badges26 bronze badges

Sign up to request clarification or add additional context in comments.

1 Answer 1