个人中心
gpt4 book ai didi

javascript - JSON 服务在 Angular JS 中不起作用

转载 作者：行者123 更新时间：2023-12-03 09:20:14 25 4
gpt4 key购买 nike

我正在尝试使用 angularjs 上的服务来获取 JSON 值，并尝试将其打印为列表。

但是，正如我所料，它不起作用。我也从 agualr js 中得到了错误。 下面的这段代码无法完全工作，因此我无法告诉您我遇到的错误是什么

有人可以告诉我这里出了什么问题吗？

html

<!doctype html>
<html ng-app="appNew">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.0-rc.2/angular.js"></script>
<script src="controllers1.js"></script>

</head>
<body>

<div ng-controller="contactController">
<H1>Here</H1>
 <ul ng-repeat="post in contact">
      <li>{{post.title}}</li>
    </ul>
</div>

</body>
</html>

js

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

app.controller('contactController', function($scope, contactServices) {
    $scope.contact=contactServices.posts;
    console.log($scope.contact);
});

app.service("contactServices", function($scope, $http) {
  $http.get('input.json').success(function(data, status, headers, config) {
      $scope.posts = data;
    }).
    error(function(data, status, headers, config) {
      // log error
    });
});

输入 JSON

[
  { 
    "id": 1,
    "title": "Lorem ipsum 1"
  },
  { 
    "id": 2,
    "title": "Lorem ipsum 2"
  }
]

我遇到的错误

enter image description here

我哪里出错了有什么帮助吗？

最佳答案

您的服务范围无法在 Controller 中使用，因此请像下面的代码一样使用 return

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

app.controller('contactController', function($scope, contactServices) {
    contactServices.getdata('input.json').then(function(success) {
         $scope.contact = success.data;
    }, function(error) {

    });
    console.log($scope.contact);
});


app.service("contactServices", function($http) {

  var apiClient = {
      getdata : getdata
  };
    return apiClient;

    function getdata(uri) {
      return $http.get(uri);
    }

});

关于javascript - JSON 服务在 Angular JS 中不起作用，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31860080/

25 4 0
文章推荐： javascript - D3 按序数排序并选择前 5 个
文章推荐： javascript - MeteorJS 我似乎无法从服务器获取对象的属性
文章推荐： Javascript - Cordova 应用程序中带有 facebook 插件的 Facebook 消息 - 方法 : "send"
文章推荐： javascript - Ember 中的 JSON.parse 空响应
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com