个人中心
gpt4 book ai didi

node.js - 为什么我的数据库不填充 AngularJS、Angular-UI-Router 和 Loopback API？

转载 作者：太空宇宙 更新时间：2023-11-04 02:23:03 25 4
gpt4 key购买 nike

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <title>User Management Tool</title>
    <script src="bower_components/jquery/dist/jquery.js"></script>
    <script src="bower_components/angular/angular.js"></script>
    <link href="bower_components/bootstrap/dist/css/bootstrap.css" rel="stylesheet">
        <script src="bower_components/ng-resource/dist/ng-resource.js"></script>
    <script src="client/js/lb-services.js"></script>
    <script src="bower_components/bootstrap/dist/js/bootstrap.js"></script>
    <script src="bower_components/angular-bootstrap/ui-bootstrap.js"></script>
    <script src="bower_components/ui-router/release/angular-ui-router.js"></script>
    <script src="app.js"></script>
</head>

<body ng-app="userApp">

<!-- NAVIGATION -->
<nav class="navbar navbar-default">
  <div class="container-fluid">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#">User Management Tool</a>
    </div>

    <!-- Collect the nav links, forms, and other content for toggling -->
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav">
        <li class="active"><a ui-sref="home">All Users <span class="sr-only">(current)</span></a></li>
        <li><a ui-sref="create">Create a User</a></li>
      </ul>
      <ul class="nav navbar-nav navbar-right">
        <li><a href="#">User Admin</a></li>
      </ul>
    </div><!-- /.navbar-collapse -->
  </div><!-- /.container-fluid -->
</nav>


<div ui-view></div>     
</body>
</html>

app.js

(function () {
 "use strict";

var userApp = angular.module("userApp", ['ui.router', 'lbServices', 'ui.bootstrap'])
    var Se_user = this;

userApp.controller("UserController", function ($scope, Se_user) {
        $scope.users = Se_user.find({});
    })

userApp.controller("CreateUserController", function($scope, Se_user, $state) {
        $scope.addUser = function (user) {
            Se_user.create(user);
            alert('Your new user has been created!');
            $scope.create.$setPristine();
            $scope.user={};
        };
});


userApp.controller("UserDetailController", function($scope, $state, $stateParams, Se_user){
        $scope.code=Se_user.findByID({id: $stateParams.user_id}); //Get record for specific user ID
});

userApp.config(function($stateProvider, $urlRouterProvider){

    $urlRouterProvider.otherwise('/home');

    $stateProvider

    .state('home', {
        url:'/home',
        templateUrl:'partial-home.html',
        controller:'UserController'
    })
    .state('create', {
        url:'/create',
        templateUrl:'partial-create.html',
        controller:'CreateUserController'
    })
    .state('edit',{
        url:'/edit',
        templateUrl:'partial-edit.html',
        contoller: 'UserDetailController'
    })

});

})();

partial-home.html

<div class="container-fluid">
<div class="row">
<div class="col-md-9">
<h1>All Users</h1>
</div>
<br>    
<div class="col-md-3">
    <div class="input-group">
      <input type="text" class="form-control" placeholder="Search for...">
      <span class="input-group-btn">
        <button class="btn btn-default" type="button">Go!</button>
      </span>
    </div><!-- /input-group -->
  </div><!-- /.col-lg-6 -->
</div><!-- /.row -->
</div><!--/.container-fluid -->

<div class="container-fluid" ng-controller="UserController as users">
            <table class="table table-hover">
                <thead>
                <tr>
                    <th>EID</th>
                    <th>First Name</th>
                    <th>Last Name</th>
                    <th>Active</th>
                </tr>
                </thead>
                <tbody>
                <tr ng-repeat="user in users">
                    <td>{{user.eid}}</td>
                    <td>{{user.first_nm}}</td>
                    <td>{{user.last_nm}}</td>
                    <td>{{user.active}}</td>
                </tr>
                </tbody>
            </table>
</div>

<div ui-view></div>

partial-create.html

<div class="container-fluid">
<div class="row">
<div class="col-md-8">
<h1>Create a User</h1>
    </div>
<div class="col-md-4">
    </div>
</div>
</div>
<div class="container-fluid" ng-controller="CreateUserController">
    <div class="row">
        <div class="col-md-4 col-md-offset-4">
    <form class="create-form" role="form" ng-submit="add(code)" name="create">
            <div class="form-group">
                <label for="user_eid">EID</label>
                <input type="text" class="form-control" ng-model="user.user_eid" placeholder="Enter EID">
                </div>
                <div class="form-group">
                <label for="user_first_nm">First Name</label>
                <input type="text" class="form-control" ng-model="user.user_first_nm" placeholder="Enter First Name">
                </div>
                <div class="form-group">
                <label for="user_last_nm">Last Name</label>
                <input type="text" class="form-control" ng-model="user.user_last_nm" placeholder="Enter Last Name">
                </div>
                <div class="form-group">
                <label for="user_email_adr">Email Address</label>
                <input type="text" class="form-control" ng-model="user.user_email_adr" placeholder="Enter Item Type">
                </div>
                <div class="form-group">
                <label for="user_role">Role</label>
                <input type="text" class="form-control" ng-model="user.user_role" placeholder="Enter Status Code">
                </div>
                <div class="form-group">
                <label for="user_active">Active</label>
                <div class="radio">
                <label>
                <input type="radio" name="optionsRadios" id="optionsRadios1" value="option1" ng-model="user.user_active" checked>
    Yes
  </label>
</div>
<div class="radio">
  <label>
    <input type="radio" name="optionsRadios" id="optionsRadios2" value="option2" ng-model="user.user_active">
    No
  </label>
</div>
                </div>
                <div class="form-group">
                <label for="insrt_dt">Creation Date</label>
                <input type="date" class="form-control" ng-model="code.insrt_dt" placeholder="Enter Creation Date">
                </div>
                <div class="form-group">
                <label for="insrt_user_id">Creator EID</label>
                <input type="text" class="form-control" ng-model="code.insrt_user_id" placeholder="Enter Creator EID">
                </div>
                <div class="form-group">
                <label for="upd_dt">Update Date</label>
                <input type="date" class="form-control" ng-model="code.upd_dt" placeholder="Enter Update Date">
                </div>
                <div class="form-group">
                <label for="upd_user_id">Update User EID</label>
                <input type="text" class="form-control" ng-model="code.upd_user_id" placeholder="Enter Update User EID">
                </div>
                <div class="btn-group btn-group-justified" role="group">
                <div class="btn-group" role="group">
                <button type="submit" class="btn btn-primary btn-lg">Submit</button>
                </div>
                </div>
        <pre>{{user | json}}

        </pre>

            </form>
        </div>
    </div>
</div>

I am seeing the following error when I run the web-app on a localhost: TypeError: Cannot set property '$save' of undefined at module.factory.config.factory.provider.$get (http://127.0.0.1:62557/client/js/lb-services.js:2409:34)

此外，我没有运行 $http 脚本，因为我已经安装并正在使用 lb-services 来进行调用和返回请求。问题在于我无法向数据库发送请求或从数据库中提取数据。我也在运行 Node。

非常感谢任何帮助或见解!!

最佳答案

您是否看过我的示例:https://github.com/strongloop/loopback-example-angular ？如果您仍然遇到问题，请告诉我。

关于node.js - 为什么我的数据库不填充 AngularJS、Angular-UI-Router 和 Loopback API？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32079982/

25 4 0
文章推荐： python - 使用 Nan 值计算最频繁的组
文章推荐： c - 如何在 c 中使用 strcat 连接 char 指针？
文章推荐： python - 查找数据框集合中的所有重复列
文章推荐： c - C 中的二维结构数组？ (或许)
太空宇宙
个人简介

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

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