离子和角度:json不会;t显示

ionic and angular : json doesn't show

本文关键字：不会 显示 json      更新时间：2023-09-26

我有一个带angular的ionic应用程序和一个我想显示的json文件。

以下是我www文件夹中的内容：

--css
--img
--js
----app.js
----controller.js
--lib
--map
----dep.json
--vendors
index.html

这是我的index.html的仿制品

<!-- your app's js -->
<script src="js/app.js"></script>
<script src="js/controller.js"></script>
<!-- svg map stuff -->
<link href="vendors/map/jqvmap.css" media="screen" rel="stylesheet" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>
<script src="vendors/map/jquery.vmap.js" type="text/javascript"></script>
<script src="vendors/map/jquery.vmap.france.js" type="text/javascript"></script>
[...]
<script id="templates/map.html" type="text/ng-template">
  <ion-view view-title="Map">
    <ion-content class="padding">
      <div class="bar bar-header item-input-inset">
        <label class="item-input-wrapper">
          <i class="icon ion-ios-search placeholder-icon"></i>
          <input type="search" placeholder="Recherchez une ville, un code postal" ng-model="query">
        </label>
        <button class="button button-clear">
          Cancel
        </button>
      </div>
      <div ng-controller="CustomerController">
        <div id="francemap"style="width: 500px; height: 500px;"></div>
        <button type="button" ng-click="myName('Mowso')"> Click Me :) </button>
      </div>
      <div class="list-dep" ng-controller="DepListCtrl">
        <!--Body content-->
        <ul class="deps">
          <li ng-repeat="dep in deps | filter:query">
            <p>{{dep.code}} - {{dep.name}}</p>
          </li>
        </ul>
      </div> 
    </ion-content>
  </ion-view>
</script>

正如你所看到的，这是一个带有选项卡的应用程序。起初，我把数据放在controller.js中，但现在我想把它们放在json文件中，但它们不再出现在屏幕上。我的controller.js看起来像这样：

 'use strict';
/* Controllers */
var map = angular.module('ionicApp');
/*map.controller('DepListCtrl', function($scope) {
  $scope.deps = [
    {'code': '01', 'name': 'Ain'},
    {...},
    {'code': '974', 'name': 'Réunion'}
  ];
});*/
map.controller('DepListCtrl', ['$scope', '$http', function($scope, $http) {
    $http.get('map/deps.json').success(function(data) {
        $scope.dep = data;
        console.log(data);
    });
}]);

我所有的数据都在我的json文件中（我在控制器中对它们进行了注释，以跟踪我以前做过的事情，基本上它们在json中是相同的，有更多的缩进）。

我昨天更新了我的nodejs，但当我看到数据消失时，我切换回v4-4。我没有任何控制台错误（我以前有一个错误，因为我没有把json放在映射文件夹中，我很傻），我的控制器中的控制台.log（数据）显示了一个数组，其中包含我的所有deps。

我做错了什么？

您将控制器中的属性命名为$scope.dep，而不是$scope.deps

这可能是路径中的一个错误。您应该使用：

$http.get('./map/deps.json').success(function(data) {
    $scope.dep = data;
    console.log(data);
});

在源树中有dep.json，在控制器中有deps.json。请确保这些也是正确的。

这可能是因为data对象返回其他信息，如http状态、标头等。在data.data中，这是您想要的实际json。

相关文章：