基于数据库实体创建模型答案

【问题标题】：Create a model based on a Database entity基于数据库实体创建模型
【发布时间】：2014-04-16 05:08:43
【问题描述】：

我是 AngularJS 的新手，我想了解如何正确地将模型与控制器分开。到目前为止，我一直在使用控制器内的模型。例如：

angular.module("app").controller("customerController", ["Customer", "$scope", "$routeParams",
    function (Customer, $scope, $routeParams){
        $scope.customer = Customer.find({ID:$routeParams.ID});
}]);

此函数从数据库中检索客户并将该客户公开给视图。但我想更进一步：例如，我可能需要封装一些东西或创建一些有用的函数来从数据库中包含的行数据中抽象出来。比如：

customer.getName = function(){
    //return customer_name + customer_surname
};
customer.save = function(){
    //save the customer in the database after some modifies
};

我想为客户创建一个模型并在许多控制器中重用该模型。也许然后我可以为客户创建一个列表，其中包含从数据库或其他东西中检索所有客户的方法。

总之，我希望有一个模型来反映数据库实体（如上面的客户），并具有与之交互的属性和方法。也许是一个创建客户或客户列表的工厂。如何在 AngularJS 中完成这样的任务？我想从你那里得到一些关于这个问题的建议。一个简单的例子将非常有用，或者是一个理论上的答案，可以帮助我理解在 Angular 中处理此类问题的正确方法。谢谢，祝你工作顺利。

【问题讨论】：

标签： javascript php html angularjs model-view-controller

【解决方案1】：

你需要创建一个工厂/服务来完成这项工作，检查jsfiddle

html:

<div ng-app="users-app">
  <h2>Users</h2>
  <div ng-view ></div>

  <script type="text/ng-template" id="list.html">
      <p>Users: {{(user || {}).name || 'not created'}}</p>
      <button ng-click='getUser()'>Get</button>
      <button ng-click='saveUser(user)'>Save</button>
  </script>
</div>

js:

angular.module('users-app', ['ngRoute'])

.factory('Users', function() {
    function User (user) {
        angular.extend(this, user);
    }

    User.prototype.save = function () {
        alert("saved " + this.name);
    }

    return {
        get: function() {
            return new User({name:'newUser'});
        }
    }
})

.config(function($routeProvider) {
  $routeProvider
    .when('/', {controller:'ListCtrl',templateUrl:'list.html'});
})

.controller('ListCtrl', function($scope, Users) {

   $scope.getUser = function() {
        $scope.user = Users.get();
    }
    $scope.saveUser = function(u) {
        u.save();
    }
})

希望有所帮助，罗恩

【讨论】：

【解决方案2】：

Angular JS 使您能够在模型更改或事件发生时自动更新视图。太棒了！

它是通过使用 $watches 来实现的，它是一种全局范围的 java 脚本对象，并在 angular js web 应用程序的整个生命周期中都保留在主内存中。

1.在将任何内容放入 $scope 之前，请考虑数据的大小，因为您附加到它的每个数据对象都会对 $watch 进行 +1。 当您从数据库中读取数据时，您可能有超过 4 列的 100 多行，相信我，它会占用客户端处理。请考虑您的数据集的大小，并阅读有关大型数据集的角度相关性能问题

2.要为您的数据库实体创建模型，我建议使用纯 JavaScript 类，即不要将所有内容都放在 $scope 上（它将避免不必要的监视！）http://www.phpied.com/3-ways-to-define-a-javascript-class/

3.您希望在用户更改值时触发事件。为此，我建议如果您使用 ng-repeat 来呈现数组中的数据，则使用 $index 获取更改完成的行号并将其传递给 ng-click ie 并使用 actionIdentifier 来区分你想要的各种活动

ng-click="someFunc($index,actionIdentifier)"

【讨论】：