CODEWITHSUNDEEP
javascriptangularjs
Aravinthan K
Aravinthan K

Reputation: 1861

how to set ng-model Value via ng-init or value tag

I want to set ng-model Value. I tried with ng-init and value tag.

My code:

Init

{{formObject.consultantId}}  // value prints

<input type="hidden" data-ng-model="formObject.consultant.id" data-ng-init="formObject.consultant.id=formObject.consultantId">

{{formObject.consultant.id}} // no data Prints

Value

{{formObject.consultantId}}  // value prints

<input type="hidden" data-ng-model="formObject.consultant.id" value="{{formObject.consultantId}}">

{{formObject.consultant.id}} // no data Prints

This works for me 

<input type="hidden" data-ng-model="formObject.consultant.id" data-ng-init="formObject.consultant.id='test'">

{{formObject.consultant.id}} // prints as test

Whats wrong in my code ? How to initialize this Value to Model ?

EDIT

I found my issue. This code works for me in Normal Html Form. But above codes are in ModelForm(directive).

Upvotes: 2

Views: 1951

Answers (2)

Milli
Milli

Reputation: 84

Can you share your controller to see how formObject is initialized. Meanwhile I have added 

var myapp= angular.module('myForm',[]);

(function(){
  
angular.module('myForm').controller('formController',[formController]);

function formController(){
  var vm = this;
  vm.formObject = {consultantId:10,consultant:{consultantId:''}};
  }

})();
<!DOCTYPE html>
<html ng-app="myForm">
  <head>
      <link rel="stylesheet" href="style.css">
  </head>

  <body>
    <div ng-controller="formController as vm">
      <span>formObject.consultantId:{{vm.formObject.consultantId}}</span>
      <input type="hidden" ng-model="vm.formObject.consultantId" ng-init="vm.formObject.consultant.consultantId=vm.formObject.consultantId"
      </br>
      <span>formObject.consultant.consultantId: {{vm.formObject.consultant.consultantId}}</span>
    </div>
  
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.14/angular.min.js"></script>
    <script src="formController.js"></script>
  </body>

</html>

my solution at : http://plnkr.co/edit/q4d8ZVXz3ki02EjkNZ0n

Upvotes: 0

Nidhish Krishnan
Nidhish Krishnan

Reputation: 20741

you should change {{formObject.consultantShare.consultant.id}} to {{formObject.consultant.id}} (to OP's edit, now removed)

Take a look at this

var app = angular.module('myApp', []);
app.controller('Controller', function ($scope) {
    $scope.formObject = {};
    $scope.formObject.consultant = {};
    $scope.formObject.consultantId = "254";

});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app='myApp' ng-controller="Controller">{{formObject.consultantId}} // value prints
    <input type="hidden" data-ng-model="formObject.consultant.id" data-ng-init="formObject.consultant.id=formObject.consultantId" />{{formObject.consultant.id}}
    <br/>{{formObject.consultantId}} // value prints
    <input type="hidden" data-ng-model="formObject.consultant.id" value="{{formObject.consultantId}}"/>{{formObject.consultant.id}} 
</div>

Upvotes: 1

Related Questions