javascript - Angular JS : Http:get on JSON created by local API

标签 javascript angularjs laravel

所以我正在自学 Angular.js。按照我在网上找到的教程,我使用 Laravel 创建了一个 RESTful API 来存储 URL。已设置基本身份验证,当前用户 id 1 已登录。我想获取索引函数中返回的 JSON,它是数据库中 user_id 与授权用户 id 匹配的所有 URL:

public function index()
{
    $urls = Url::where('user_id', Auth::user()->id)->get();

    return Response::json(array(
        'error=> false,
        'urls' => $urls->toArray()),
         200
    );
}

我相信当我访问本地站点 http://readitlater.loc/api/v1/url 时会返回 JSON我得到一个对象数组。在我的索引页面上,我将 ng-app 指令定义为 html 元素的属性:

<html lang="en" data-ng-app=""> 

我有一个定义构造函数的脚本:

<script>
function mainController($scope, $http) 
{
    $http.get("http://readitlater.loc/api/v1/url/")
    .success(function(response) {$scope.urls = response;});
}

</script>

readitlater.loc/api/v1/url 是我的 API 中索引的路由。当我在浏览器中输入它时,我会得到一个对象数组,我猜这就是正在创建的 JSON。由于某种原因,我无法让它在浏览器中显示:

<body class="container" data-ng-controller="mainController">
<ul class="list-group">
        <li class="list-group-item" ng-repeat="address in urls">
        {{ address.url }}
        </li>
    </ul>

最佳答案

根据您上面的评论,您的 $scope.urlsurls 对象,并且该对象包含 url key。所以你可以按如下方式更改你的代码

<ul class="list-group">
  <li class="list-group-item" ng-repeat="address in urls.urls">
   {{ address.url }}
  </li>
</ul>

关于javascript - Angular JS : Http:get on JSON created by local API,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27000293/

相关文章:

javascript - 使用 ngStorage 进行 Protractor 测试

javascript - 哪个是 Angular 错误,我找不到它

php - 调试 iconv_strlen 错误 - PHP 5.5

asp.net - 加载大页面时 Internet Explore 没有响应

javascript - 即使在提交 jsp 表单后仍保留在同一页面中

javascript - 动态更改表单错误的 Angular 工具提示内容

php - 从作业表中删除时 Laravel 队列死锁

Laravel 4 - 使用 hasMany 关系时插入多条记录

javascript - 如何使用 RxJs 异步加载图像并在所有加载后执行方法

javascript - 从包含链接的表元素中获取文本