Question

作为angularjs框架的新手，我试图使用控制器来检索JSON并显示元素，但不会显示所需的结果。

的index.html

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/X.Y.Z/angular-route.js"></script>
<script src="../public/javascripts/processJson.js"></script>
</head>
<body>    
   <div ng-app="getJson"><div ng-controller="controller1">
      <div ng-repeat="post in posts">
       <div ng-switch-when="text"><input type="text" id="{{post.id}}" ng-model="post.value" placeholder="{{post.placeholder}}">
 </div>
  </div>
  </div>
</div>
 </body>
 </html>

控制器： processJson.js

 var getJson = angular.module('getJson', []).controller('controller1',   function ($scope, $http) {
var url = "../../routes/fields.js";
console.log(url);
$http.get(url).success(function (data) {
    $scope.posts = data;
  });

 });

fields.js

var express=require('express');
var router =express.Router();


 router.get('/fieldlist',function(req,res){
  var db=req.db;
  var collection=db.get('domlist');
   collection.find({},{},function(e,docs){
    res.json(docs); 
  });  
});

module.exports=router;

还使用mongodb存储和检索JSON数据.URL http://localhost:3000/fields/fieldlist返回存储在mongodb中的json数组。

Answer 1

您可以尝试$scope.posts = data.data。

HTTP请求将返回一个带有data属性的对象：

响应对象具有以下属性：

data - {string | Object} - 用。转换的响应体   变换函数。 status - {number} - 的HTTP状态代码   响应。 headers - {function（[headerName]）} - 头部getter函数。   config - {Object} - 用于生成的配置对象   请求。 statusText - {string} - 响应的HTTP状态文本。

有关详细信息：API Reference - $http

Answer 2

你有一个ng-switch-当没有ng-switch时会导致错误：

Error: [$compile:ctreq] Controller 'ngSwitch', required by directive 'ngSwitchWhen', can't be found!

我准备了一个JSFiddle https://jsfiddle.net/5ab19ozh/

使用AngularJS显示json数组的元素

2 个答案: