如何打印JSON結果以角js查看

Question

您好我是新來的角js，我需要一些幫助，我有一個角js編輯窗體當用戶點擊編輯它重定向到編輯窗體，但我得到一些問題我的json結果如下所示：

[{"0":"3", 
     "1":"The only people for me are the mad ones", 
     "2":"「The only people for me are the mad ones, the ones who are mad to live, mad to talk, mad to be saved, desirous of everything at the same time, the ones who never yawn or say a commonplace thing, but burn, burn, burn like fabulous yellow roman candles exploding like spiders across the stars.」", 
     "3":"2015-05-08 13:01:58", 
     "id":"3","title":"The only people for me are the mad ones", 
     "description":"「The only people for me are the mad ones, the ones who are mad to live, mad to talk, mad to be saved, desirous of everything at the same time, the ones who never yawn or say a commonplace thing, but burn, burn, burn like fabulous yellow roman candles exploding like spiders across the stars.」", 
     "created_on":"2015-05-08 13:01:58" 
}] 

我想知道如何在視圖中打印我的標題，描述。

這裏是我的控制文件：在這裏我從數據庫中獲取數據：

var myApp = angular.module("blogapp",[]); 

    myApp.config(['$routeProvider',function($routeProvider){ 

    $routeProvider 
     .when('/home',{ 
     templateUrl:'home.html', 
     controller:'blogcontroller' 
     }) 
     .when('/list',{ 
     templateUrl:'list.html', 
     controller:'blogcontroller' 

     }) 
     .when('/add',{ 

     templateUrl:'add.html', 
     controller:'addcontroller' 
     }) 
     .when('/edit/:Blogid',{ 

     templateUrl:'edit.html', 
     controller:'editcontroller' 
     }) 
     .otherwise({ 
     redirectTo:'/home' 
     }); 

    }]); 


myApp.controller('blogcontroller',function ($scope,$http){ 

    $http({method: 'GET' , url: 'getallblog.php'}).success(function(data){ 
     $scope.allblog = data; 

     console.log(data); 
    }); 

// DELETE blog HERE 
$scope.removeRow= function(id){ 



    $http.post("removeblog.php",{'id' : id}).success(function(data,status,headers,config){ 
     window.location='index.html'; 
     console.log("Deleted Successfully"); 

    }); 
    }; 

// delete blog code ends here 


    }); 


myApp.controller('addcontroller',function ($scope,$http){ 





    /// New Post Here 
    $scope.new_post =function(){ 



    $http.post("addblog.php" ,{'title' : $scope.title ,'description' : $scope.description }).success(function(data,status,headers,config){ 
     window.location='index.html'; 
     console.log("inserted Successfully"); 
    }); 
    }; 



    // New Post ends Here 

}); 

myApp.controller('editcontroller',function ($scope,$http,$routeParams){ 

    $scope.Blogid = $routeParams.Blogid; 

    $http.post("getblog.php",{'id' : $scope.Blogid}).success(function(data){ 
     $scope.editit = data; /// here i get the resuly want to pass it t view 

     console.log(data); 

    }); 


}); 

我的編輯HTML表單：edit.html

<!-- Page Content --> 
    <div class="container"> 

     <div class="row"> 

      <!-- Blog Entries Column --> 
      <div class="col-md-6"> 

       <h1 class="page-header"> 
        Angular Blog 

       </h1> 


       <div > 

     <form class="form-signin"> 


     <h2 class="form-signin-heading">Modify // want to print title here </h2> 
     <div class="row"> 
     <div class="col-md-12"> 
     <label for="posttitle" class="sr-only">Email address</label> 
     <input type="text" id="posttitle" class="form-control" ng-model="{{title}}" required="" value=""><br> 
     <span>Title : // want to print title here</span> 
     </div> 
     </div> 
     <br> 
     <div class="row"> 
     <div class="col-md-12"> 
     <label for="postdetails" class="sr-only">Password</label> 
     <textarea id="postdetails" class="form-control" ng-model="description" required=""></textarea> 
     <br> 
     <span>Blog Description: // want to print description here</span> 
     </div> 
     </div> 
     <br> 
     <div class="row"> 
     <div class="col-md-3"></div> 
     <div class="col-md-6"> 
     <button class="btn btn-lg btn-primary btn-block" type="button" ng-click="edit_post()" name="editblog">Modify Now</button> 
     </div> 
       <div class="col-md-3"></div> 
     </div> 

     </form> 

     </div> 

      </div> 
      <div class="col-md-2"></div> 
      <!-- Blog Sidebar Widgets Column --> 
      <div ng-include="'includes/sidebar.html'">      
</div> 

     </div> 
     <!-- /.row --> 



    </div> 
    <!-- /.container --> 

Answer 1

打印您的標題，你首先需要替換此行JS：

$scope.allblog = data; 

與

$scope.allblog = data[0]; 

現在，你可以在HTML中寫下如下語句：

{{allblog.title}} 

Answer 2

事情是這樣的：

 <span>Blog Description: {{allblog.description}}</span> 

或

<span>Blog Description: <span ng-bind-html ="allblog.description"></span></span> 

如果您allblog是一個陣列中使用allblog [0]