Question

道歉，如果这是一个简单的，我对环回/后端相对较新，

我要做的是使用以下代码更新现有数据库记录ID和名称。 HTML文件

<div>
    <h1>COMPANY DETAILS</h1>
</div>
<div>
    <div>
        <table>
            <thead>
                <tr>
                    <th>Company Name</th>
                    <th>Company Code</th>
                    <th>Remove</th>
                    <th>Edit</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td><input class="form-control" ng-model="newCompany.name"></td>
                    <td><input class="form-control" ng-model="newCompany.id"></td>
                    <td><button class="btn btn-primary" ng-click="add()">Add</button></td>
                    <td><button class="btn btn-info" ng-click="update()">Update</button></td>
                </tr>
                <tr ng-repeat="company in companies | orderBy:'+name'">
                    <td>{{company.name}}</td>
                    <td>{{company.id}}</td>
                    <td><button class="btn btn-danger" ng-click="remove(company.id)">Remove</button> </td>
                    <td><button class="btn btn-warning" ng-click="edit(company)">Edit</button> </td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

JS档案

'use strict';

/**
 * @ngdoc function
 * @name abcApp.controller:CompanyCtrl
 * @description
 * # CompanyCtrl
 * Controller of the abcApp
 */
angular.module('abcApp')
  .controller('CompanyCtrl', ['$scope', 'Company', function ($scope, Company) {
      $scope.newCompany = { 'id': '', 'name': '' };
      $scope.companies = [];
      Company
          .find()
          .$promise
          .then(function (results) {
              $scope.companies = results;
          });

      $scope.update = function (company) {
          company.findById({ id: company })
            .$promise
            .then(function () {                  
                $scope.company.id = 13.40;
                console.log(company.id);
           $scope.company.$save();
       });
      };

      $scope.edit = function (company) {
          $scope.newCompany = { id: company.id, name: company.name };
      }
      $scope.add = function () {
          Company.create($scope.newCompany, function (company) {
              $scope.newCompany = { 'id': '', 'name': '' };
              Company
                  .find()
                  .$promise
                  .then(function (results) {
                      $scope.companies = results;
                  });

          }, function (errorResponse) {
              console.log(errorResponse);
          });
      };

      $scope.remove = function (cid) {
          Company.deleteById({ id: cid })
           .$promise
              .then(function () {
                  console.log('deleted');
                  Company
                          .find()
                          .$promise
                          .then(function (results) {
                              $scope.companies = results;
                          });
              });
      }
  }]);

$ scope.edit函数将公司ID和名称带入两个文本框，$ scope.update函数用于更新数据库记录，编辑功能正常工作但是我的$ scope.update存在问题当我点击更新按钮时，我在浏览器控制台中收到以下错误。

无法设置未定义或空引用的属性“名称”

对于这篇长篇文章感到抱歉，任何帮助都会有很大帮助

Answer 1

看起来你正在混合客户端代码和服务器端代码，chart: { // ... backgroundColor: "transparent", plotBackgroundColor: "transparent", // Needs to be set for chart.plotBackground to be defined. zoomType: "xy", events: { load: function() { this.plotBackground.htmlCss({ cursor: "zoom-in" }) } } }工作的原因是因为它只包含客户端代码。

Mongoose调用（Collection.create，Collection.find ...）应该是服务器端。

以下是我在你的案例中使用MEAN堆栈的方法：

Mongo是您的数据库，它包含您的文档和集合。

Express用于使用http调用将您的请求从客户端转发到Mongo。

Angular是客户端框架，您的JS客户端代码将主要驻留在角度控制器中。

例如：

我们想要数据库中的所有碳水化合物。

Clientside（JS）：

$scope.edit

Clientside（HTML）：

angular.module('abcApp')
  .controller('myCarotCtrl', [dependencies,
  function(dependencies) {
     $scope.result = '';
     $scope.getCarrots = function() {
         $http.get('/carrots').
         then(function(data) {
              //Called when the request is successful
              $scope.result = data;
         },
         function(error) {
             //Called when the request failed
             console.log(error)
         }
     }
  }]);

服务器端：

<div ng-controller="myController" ng-init="getCarrots()">{{result}}</div>

我无法测试上面的代码，但我认为它会给你一些关于整个堆栈如何工作的想法。

Answer 2

company.findById（{id：company}）

这是一个错字吗？ company中的资本C？我认为它应该与我在https://github.com/strongloop/loopback-example-angular/blob/master/client/js/controllers/todo.js#L7-L8

的例子类似

Answer 3

你的$ scope.update函数在很多方面都是错误的。首先是因为它期望你发送公司参数，但你正在使用空参数调用方法。

这是您的方法：

$scope.update = function (company) {
  company.findById({ id: company })
    .$promise
    .then(function () {                  
        $scope.company.id = 13.40;
        console.log(company.id);
        $scope.company.$save();
  });

};

这是您的HTML

<td><button class="btn btn-info" ng-click="update()">Update</button></td>

“company”参数未定义，因此您的控制台会给您一条错误消息（您使用的是未定义的findById id参数值 - “id：company”）。

如果要调用此类更新方法，则可以使用$ scope.newCompany变量代替公司参数，该变量已经包含您在单击编辑按钮后要使用的数据。这就是说你的更新方法应该是这样的：

$scope.update = function () {
  Company.findById({ id: $scope.newCompany.id })
    .$promise
    .then(function (company) {
      console.log(company);
      //$scope.company.$save();
    });
};

要注意的第二件事是你不需要编写远程“保存”方法（除非你为练习编写它）。 Loopback已经为您生成了CRUD方法。因此，如果您想从客户端更新您的模型，请使用“upsert”方法或类似的最符合您需求的方法。有关服务器上可用方法的列表，请参阅http://localhost:3000/explorer。

平均堆栈环回更新

3 个答案: