首页 > 解决方案 > ReferenceError: jurusan 没有在 Angular 中用 Nodejs 定义

问题描述

我是新手,尝试了 AngularJS 和 NodeJS,我陷入了这个错误。

我正在尝试创建一个动态选择选项,我正在尝试使用 NodeJS 从 MySQL 数据库中回显一个表并将数据扔给 Angular。我已经尝试了很多东西来解决这个问题,但也许我仍然不太了解 angular,所以我还没有解决这个问题。

我正在使用 nodeJS 版本。1.0.0 和 AngularJS 版本 1.7.5。这是我的代码:

controlAll.js

var http = require('http');
var qs = require('querystring');
var fs = require('fs');
var hbs = require('hbs');
var express = require('express');
var bodyParser = require('body-parser');
var route = express();
var mysql = require('mysql');

var konek = mysql.createConnection({
    host: "localhost",
    user: "root",
    password: "",
    database: "mahasiswa",
});
konek.connect(function(err){
    if(err) throw err;
    console.log("udah konek");
});

route.set('view engine', 'hbs');
route.use(bodyParser.json());
route.use(bodyParser.urlencoded({ extended: true }));

route.get('/mahasiswa/add', function(req, res){
    res.render("formm");
});
route.get('/jurusan', function(req,res){
    konek.query("SELECT * FROM `jurusan`",function(err,jurusan)
    {
        if (err) throw err;
        res.send(JSON.stringify({
            jurusan:jurusan
        }));
    });
});

表格.hbs

<!DOCTYPE html>
<html>
<head>
    <title>tambah mahasiswa</title>
    <link rel="stylesheet" href="/asset/css/bootstrap.min.css">
    <script src="/asset/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="/ang/angular.js"></script>
</head>
<body ng-app="coba">
    <div class="container">
        <form method="POST" action="/mahasiswa/add">
            <div class="form-group">
                <label>Nama Mahasiswa</label>
                <input type="text" name="nama" placeholder="nama" class="form-control">
            </div>
            <div class="form-group">
                <label>Nomor Pokok Mahasiswa</label>
                <input type="text" name="npm" placeholder="npm" class="form-control">
            </div>
            <div ng-controller="drpdn">
                <div class="form-group">
                    <label>Jurusan</label>
                    <select name="id_jurusan" ng-model="jurusan" class="form-control">
                        <option disabled selected value>--Pilih Jurusan--</option>
                        <option ng-repeat="jur in jurusan" value="{{jur.id_jurusan}}">{{jur.namajurusan}}</option>
                    </select>
                </div>
                <div class="form-group">
                    <label>Program Studi</label>
                    <select name="id_prodi" class="form-control">
                        <option disabled selected value>--Pilih Program Studi--</option>
                    </select>
                </div>
            </div>
            <button type="submit" class="btn btn-primary">simpan</button>
        </form>
    </div>
</body>
</html>

<script type="text/javascript">
    var app = angular.module('coba',[]);
app.controller('drpdn', function($scope, $http){
       $http.get("/jurusan")  
       .then(function(response){
            $scope.jurusan = response.jurusan;
       });
  console.log($scope.jurusan);
});
</script>

我的nodejs响应,我把数组放在另一条路线上:

节点

console.log($scope.jurusan)

在此处输入图像描述

这是我的错误:

我的错误

另一个错误:

错误 2

标签: javascriptmysqlangularjsnode.js

解决方案


您的控制器(或提供服务)应该jurusan从您的 nodejs 端点加载数据,然后使用它:

app.controller('drpdn', function($scope, $http){
    // Simple GET request example:
    $http({
        method: 'GET',
        url: '/jurusan' // USE YOUR NODEJS ENDPOINT TO LOAD DATA
    }).then(function(response) {
        // this callback will be called asynchronously
        // when the response is available
        $scope.jurusan = response.data.jurusan;
    }, function(response) {
      // called asynchronously if an error occurs
      // or server returns response with an error status.
    });
});

推荐阅读