CODEWITHSUNDEEP
javascriptangularjs
Niranjan Godbole
Niranjan Godbole

Reputation: 2175

Unable to view value in textbox after binding in angularjs

Hi I am developing Angularjs application. I am trying to bind value to textbox as below. 

<ul>
    <li ng-repeat="screen in screenMap">
        <input type="text" ng-model="screenname" value="{{screen.scrn_name}}" />
    </li>
</ul>

After binding value to textbox, Textbox does not show any value. But when i see in browser i can see below value is binded

 <input type="text" ng-model="screenname" value="USerProfile" class="ng-pristine ng-untouched ng-valid">

May i know why i am not able to see value in textbox? Any help would be appreciated. Thank you.

Upvotes: 1

Views: 152

Answers (3)

Deepshikha Chaudhary
Deepshikha Chaudhary

Reputation: 398

ng-model="your_value" I think it will work.

Upvotes: 0

Sajeetharan
Sajeetharan

Reputation: 222582

USE ng-value,

<input type="text" ng-model="screenname" ng-value="screen.scrn_name" />

DEMO 

var app = angular.module('myApp', []);
app.controller('myCtrl', function($scope, $http) {
   $scope.screenMap = [{
  "id": 1,
  "scrn_name": "Redhold"
}, {
  "id": 2,
  "scrn_name": "Solarbreeze"
}];
});
<!DOCTYPE html>
<html>

<head>
  <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
</head>

<body>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.4/angular.min.js"></script>

  <div ng-app="myApp" ng-controller="myCtrl">
   <ul>
  <li ng-repeat="screen in screenMap">
  <input type="text" ng-model="screenname" ng-value="screen.scrn_name" />
  </li>
  </ul>
    
  </div>
  
</body>

</html>

Upvotes: 2

Icycool
Icycool

Reputation: 7179

You are almost there. In Angular model is equal to value.

<input type="text" ng-model="screen.scrn_name" /> should suffice.

Upvotes: 1

Related Questions