AngularJS. Input с value пустой

324

15 августа 2017, 12:50

Нужно сделать простой калькулятор.
Делал так:

<input type="number" value="25" ng-model="first">
<input type="number" value="25" ng-model="second">
<h1>{{first + second}}</h1>

Считает он правильно, но я поставил value и при загрузке страницы эти инпуты пустые. Что не так? Или вместо ng-model исп. что-то другое?

Answer 1

Если вы указали ng-model для инпута, то значение всегда будет браться оттуда. Можно присвоить начальные значение через ng-init:

<input type="number" ng-init="first=25" ng-model="first">
<input type="number" ng-init="second=25" ng-model="second">
<h1>{{first + second}}</h1>

Или в контроллере (в большинстве случаев более правильный подход)

// JS
app.controller('MainCtrl', function($scope) {
  $scope.first = 25';
  $scope.second = 25';
});
// HTML
<div ng-controller="MainCtrl">
  <input type="number" value="25" ng-model="first">
  <input type="number" value="25" ng-model="second">
  <h1>{{first + second}}</h1>
</div>