CODEWITHSUNDEEP
angularjs
user160820
user160820

Reputation: 15200

AngularJs the json object is not displayed

I am trying to display the json object at the end of the form like

    <p>
        <input type="text" name="title" ng-model="blog.title" />
    </p>
    <p>
        <textarea name="txt" ng-model="blog.txt"></textarea>
    </p>
    <p>
        <select name="type" ng-model="blog.type" ng-options="type.id as type.name for type in types" />
    </p>
    **{{blog}}**
    <br/>

</form>

but it displays the object not. but if I place the {{blog}} right after form open tag, then it works.

Any idea?

Upvotes: 0

Views: 49

Answers (2)

sylwester
sylwester

Reputation: 16498

You need to close select tag ie:

<select name="type" ng-model="blog.type" ng-options="type.id as type.name for type in types"></select>

please see demo below

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

app.controller('homeCtrl', function($scope) {


  $scope.types = [{
    id: 1,
    name: "one"
  }]

});
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

<body>
  <div ng-app="app">
    <div ng-controller="homeCtrl">
      <form>

        <p>
          <input type="text" name="title" ng-model="blog.title" />
        </p>
        <p>
          <textarea name="txt" ng-model="blog.txt"></textarea>
        </p>
        <p>
          <select name="type" ng-model="blog.type" ng-options="type.id as type.name for type in types"></select>
        </p>
        {{blog}}
        <br/>

      </form>


    </div>
  </div>
</body>

Upvotes: 1

manzapanza
manzapanza

Reputation: 6205

Have you tried with the json filter?

{{blog | json}}

Upvotes: 1

Related Questions