草庐IT

javascript - AngularJS $http.get 不检索后端数据

coder 2023-10-18 原文

我是“Angularjs 和 Nodejs”组合的新手，我正在尝试制作一个简单的 crud 应用程序。问题是，当我在 Angular 中使用 $http.get 时，它不会转到后端。

这是我的代码:

服务器.js( Node )

var connection = util.getDBConnection();
app.use(express.static(__dirname + "/public"));
app.use(bodyParser.json());
//routes = require('./routes/routes')(app, connection);

app.get('/', function(req, res) {
console.log("Backend");
        connection.query("SELECT * FROM user_info;", function(err, rows){
            if(err){
                res.redirect('/error');
                console.log("Error in the database: " + err);
            } 
            res.end(JSON.stringify(rows));
            console.log("Connected to the Database!");
        });
    });

Angular 模块.js

var app = angular.module('two_way', ['ngRoute']);
app.controller('two_way_control', function($scope, $http){
    $scope.message = "Hello from controller";
    $http.get('/').success(function(data){
        console.log("http get");
        console.log(data);
        $scope.profile_pictures = data;
    });
});

console.log(data) 返回整个 index.html

index.html

<body>
    <div id="container" ng-app="two_way" ng-controller="two_way_control">
        <div class="row" ng-repeat="data in profile_pictures">
            {{message}}
            <div class=".col-sm-6 .col-md-5 .col-lg-6">
                <h4>User Say's</h4><hr>
                <p>
                    This is a Demo feed. It is developed to demonstrate Two way data binding.
                </p>
                {{ data.profile_picture }}
                <img src="{{data.profile_picture}}">
            </div>
        </div>
    </div>
</body>

但是这段代码返回的是json格式的mysql数据:

app.get('/load', function(req, res) {
console.log("Backend");
        connection.query("SELECT * FROM user_info;", function(err, rows){
            if(err){
                res.redirect('/error');
                console.log("Error in the database: " + err);
            } 
            res.end(JSON.stringify(rows));
            console.log("Connected to the Database!");
        });
    });

请帮忙。提前致谢，抱歉英语不好。

最佳答案

用于修复 chrome 控制台中的错误

"GET http://localhost:8000/%7B%7Bdatas.profile_picture%7D%7D 404 (Not Found)"

我建议你使用 ngSrc 指令，而不是

<img src="{{datas.profile_picture}}">

使用

<img ngSrc="{{datas.profile_picture}}">

如 doc 中所述

希望对你有帮助

关于javascript - AngularJS $http.get 不检索后端数据，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/30009879/

javascriptAngularJS34codeconsolemysqlnode.js

有关javascript - AngularJS $http.get 不检索后端数据的更多相关文章

  1. ruby - Facter::Util::Uptime:Module 的未定义方法 get_uptime (NoMethodError) - 2

    我正在尝试设置一个puppet节点，但ruby​​gems似乎不正常。如果我通过它自己的二进制文件(/usr/lib/ruby/gems/1.8/gems/facter-1.5.8/bin/facter)在cli上运行facter，它工作正常，但如果我通过由ruby​​gems(/usr/bin/facter)安装的二进制文件，它抛出:/usr/lib/ruby/1.8/facter/uptime.rb:11:undefinedmethod`get_uptime'forFacter::Util::Uptime:Module(NoMethodError)from/usr/lib/ruby

  2. ruby - 解析 RDFa、微数据等的最佳方式是什么，使用统一的模式/词汇(例如 schema.org)存储和显示信息 - 2

    我主要使用Ruby来执行此操作，但到目前为止我的攻击计划如下:使用gemsrdf、rdf-rdfa和rdf-microdata或mida来解析给定任何URI的数据。我认为最好映射到像schema.org这样的统一模式，例如使用这个yaml文件，它试图描述数据词汇表和opengraph到schema.org之间的转换:#SchemaXtoschema.orgconversion#data-vocabularyDV:name:namestreet-address:streetAddressregion:addressRegionlocality:addressLocalityphoto:i

  3. ruby - 如何模拟 Net::HTTP::Post？ - 2

    是的，我知道最好使用webmock，但我想知道如何在RSpec中模拟此方法:defmethod_to_testurl=URI.parseurireq=Net::HTTP::Post.newurl.pathres=Net::HTTP.start(url.host,url.port)do|http|http.requestreq,foo:1endresend这是RSpec:let(:uri){'http://example.com'}specify'HTTPcall'dohttp=mock:httpNet::HTTP.stub!(:start).and_yieldhttphttp.shou

  4. ruby - Ruby 有 `Pair` 数据类型吗？ - 2

    有时我需要处理键/值数据。我不喜欢使用数组，因为它们在大小上没有限制(很容易不小心添加超过2个项目，而且您最终需要稍后验证大小)。此外，0和1的索引变成了魔数(MagicNumber)，并且在传达含义方面做得很差(“当我说0时，我的意思是head...”)。散列也不合适，因为可能会不小心添加额外的条目。我写了下面的类来解决这个问题:classPairattr_accessor:head,:taildefinitialize(h,t)@head,@tail=h,tendend它工作得很好并且解决了问题，但我很想知道:Ruby标准库是否已经带有这样一个类？ 最佳

  5. ruby - Net::HTTP 获取源代码和状态 - 2

    我目前正在使用以下方法获取页面的源代码:Net::HTTP.get(URI.parse(page.url))我还想获取HTTP状态，而无需发出第二个请求。有没有办法用另一种方法做到这一点？我一直在查看文档，但似乎找不到我要找的东西。 最佳答案 在我看来，除非您需要一些真正的低级访问或控制，否则最好使用Ruby的内置Open::URI模块:require'open-uri'io=open('http://www.example.org/')#=>#body=io.read[0,50]#=>"["200","OK"]io.base_ur

  6. ruby - 我如何添加二进制数据来遏制 POST - 2

    我正在尝试使用Curbgem执行以下POST以解析云curl-XPOST\-H"X-Parse-Application-Id:PARSE_APP_ID"\-H"X-Parse-REST-API-Key:PARSE_API_KEY"\-H"Content-Type:image/jpeg"\--data-binary'@myPicture.jpg'\https://api.parse.com/1/files/pic.jpg用这个:curl=Curl::Easy.new("https://api.parse.com/1/files/lion.jpg")curl.multipart_form_

  7. 世界前沿3D开发引擎HOOPS全面讲解——集3D数据读取、3D图形渲染、3D数据发布于一体的全新3D应用开发工具 - 2

    无论您是想搭建桌面端、WEB端或者移动端APP应用，HOOPSPlatform组件都可以为您提供弹性的3D集成架构，同时，由工业领域3D技术专家组成的HOOPS技术团队也能为您提供技术支持服务。如果您的客户期望有一种在多个平台（桌面/WEB/APP，而且某些客户端是“瘦”客户端）快速、方便地将数据接入到3D应用系统的解决方案，并且当访问数据时，在各个平台上的性能和用户体验保持一致，HOOPSPlatform将帮助您完成。利用HOOPSPlatform，您可以开发在任何环境下的3D基础应用架构。HOOPSPlatform可以帮您打造3D创新型产品，HOOPSSDK包含的技术有：快速且准确的CAD

  8. FOHEART H1数据手套驱动Optitrack光学动捕双手运动(Unity3D) - 2

    本教程将在Unity3D中混合Optitrack与数据手套的数据流，在人体运动的基础上，添加双手手指部分的运动。双手手背的角度仍由Optitrack提供，数据手套提供双手手指的角度。 01  客户端软件分别安装MotiveBody与MotionVenus并校准人体与数据手套。MotiveBodyMotionVenus数据手套使用、校准流程参照：https://gitee.com/foheart_1/foheart-h1-data-summary.git02  数据转发打开MotiveBody软件的Streaming，开始向Unity3D广播数据；MotionVenus中设置->选项选择Unit

  9. 使用canal同步MySQL数据到ES - 2

    文章目录一、概述简介原理模块二、配置Mysql使用版本环境要求1.操作系统2.mysql要求三、配置canal-server离线下载在线下载上传解压修改配置单机配置集群配置分库分表配置1.修改全局配置2.实例配置垂直分库水平分库3.修改group-instance.xml4.启动监听四、配置canal-adapter1修改启动配置2配置映射文件3启动ES数据同步查询所有订阅同步数据同步开关启动4.验证五、配置canal-admin一、概述简介canal是Alibaba旗下的一款开源项目，Java开发。基于数据库增量日志解析，提供增量数据订阅&消费。Git地址：https://github.co

  10. Get https://registry-1.docker.io/v2/: net/http: request canceled while waiting - 2

    1.错误信息：Errorresponsefromdaemon:Gethttps://registry-1.docker.io/v2/:net/http:requestcanceledwhilewaitingforconnection(Client.Timeoutexceededwhileawaitingheaders)或者：Errorresponsefromdaemon:Gethttps://registry-1.docker.io/v2/:net/http:TLShandshaketimeout2.报错原因：docker使用的镜像网址默认为国外，下载容易超时，需要修改成国内镜像地址（首先阿里

随机推荐