Вопрос по frameworks, orm, model-view-controller, javascript, angularjs – угловые отношения модели JS

28

последние пару дней пробовал Angular JS, и я могуВыяснить, как работать с отношениями между моделями.

Проект яу меня есть модель Users и модель Accounts. В моей базе данных настроено, что у каждой учетной записи есть поле с именем «принадлежит' которая является ссылкой внешнего ключа на идентификатор пользователя, которому принадлежит эта учетная запись.

В Angular у меня есть следующие настройки в файле с именем main.js

var myApp = angular.module('myApp', ['ngResource']);

var Users = myApp.factory('Users', function($resource) {
    var User = $resource('http://api.mydomain.ca/users/:id',
        {id:'@id'},
    {});
    return User;
});

var Accounts = myApp.factory('Accounts', function($resource) {
    var Accounts = $resource('http://api.mydomain.ca/accounts/:id',
        {id:'@id'},
    {});
    return Accounts;
});


function UsersCtrl($scope, Users) {
    $scope.users = Users.query();
}

function AccountsCtrl($scope, Accounts) {
    $scope.accounts = Accounts.query();
}

и следующий шаблон




  
  
  Angular Test
  

  



    
        
            
                
                    ID
                    First Name
                    Last Name
                
            
            
                
                    {{user.id}}
                    {{user.firstName}}
                    {{user.lastName}}
                
            
        
    
    
        
            
                
                    ID
                    Owned By
                
            
            
                
                    {{account.id}}
                    {{account.ownedBy}}
                
            
        
    








и это работает. Он получает ресурс JSON с моего REST-сервера и отображает его в виде таблицы. Какие'следующий шаг, который мне нужно сделать, чтобы получить одну таблицу, которая показывает пользователей и номера их счетов? (эквивалент базы данных JOIN?) Есть ли другой способ сделать это для отношений один ко многим? (то есть ... на счету много транзакций)

Спасибо за помощь :)

Я бы выстроил объект на стороне сервера{user: {account, account...}} поэтому клиент мог просто взять данные и связать их с моей моделью, и сделать всего один серверный вызов, чтобы получить все данные. Ben Felda
У меня есть контроль над тем, что возвращает сервер. Но я подумал, что лучше было бы разделить модели пользователей и учетных записей (нормализовать?). Как бы вы посоветовали мне вернуть данные с сервера? Devin Crossman
У вас есть контроль над тем, что возвращает сервер? Вам следует перестроить модель так, как вы хотите, прежде чем связывать ее с Angular, и лучшее место для этого - API вашего сервера. Ben Felda
@BenFelda В случае API-интерфейсов RESTful довольно часто можно выполнять соединения на стороне клиента. Josh David Miller
Я ответил на это сообщение:stackoverflow.com/a/17055281/1558820 Klederson Bueno

Ваш Ответ

2   ответа
0

JS-данных если мне нужны отношения в пользовательском интерфейсе. Библиотека обрабатывает отношения и моделирование данных в целом довольно элегантно. Я нашел, что проще в использовании, даже если вы просто ищете хороший интерфейс API. Я предпочитаю это ngResource.

В вашем случае у вас будет модель для пользователя и модель для учетной записи

src/app/data/account.model.coffee

angular.module 'app.data' #this can be your module name
  .factory 'Account', (DS) ->
    DS.defineResource
      name: 'account'
      endpoint: 'accounts'
      relations:
        belongsTo:
          user:
            localKey: 'userId'
            localField: 'user'

src/app/data/user.model.coffee

angular.module 'app.data'
  .factory 'User', (DS) ->

    DS.defineResource
      name: 'user'
      endpoint: 'users'
      relations:
        belongsTo:
          account: #make sure this matches the 'name' property of the other model
            foreignKey: 'userId'
            localField: 'account'
25

$resource Безразлично»не может иметь никакого отношения к отношениям, которые нене обрабатывается сервером, но этодовольно просто с:$http

  return {
    get: function getUser( id ) {
      // We create our own promise to return
      var deferred = $q.defer();

      $http.get('/users/'+id).then( function ( user ) {
        $http.get('/accounts/'+user.id).then( function ( acct ) {

          // Add the account info however you want
          user.account = acct;

          // resolve the promise
          deferred.resolve( user );

        }, function getAcctError() { deferred.reject(); } );
      }, function getUserError() { deferred.reject(); } );

      return deferred.promise;
    }
  };
});

И тогда в вашем контроллере вы можете просто использовать его как любое другое обещание:

UserService.get( $scope.userId ).then( function ( user ) {
  $scope.user = user;
});

И это'Доступно для вашего шаблона!

<div>
    User: "{{user.firstName}} {{user.lastName}}" with Acct ID "{{user.acct.id}}".
</div>
Есть ли причина для упаковкиdeferred.reject в функцияхgetAcctError а такжеgetUserError, а не просто?}, deferred.reject); Alex McMillan
Спасибо за ваш ответ, похоже, это будет работать. Я думал, что $ resource обернул $ http и должен был быть лучше чем-то. Когда, если вообще, я должен использовать $ resource? Devin Crossman
@AlexMcMillan В этом случае нет. Но я предполагаю, что в большинстве случаев служба захочет обработать ошибку каким-либо образом, а не повторно обрабатывать ее (возможно, по крайней мере) в нескольких контроллерах. Поэтому я выбрал многословие здесь. Josh David Miller
Этоделает обернуть $ http и $ ресурс совершенно потрясающе дляочень типичный REST варианты использования. Однако, если вы выйдете за рамки основ, $ ресурс может начать мешать. Например, вымог решить эту проблему, используя $ ресурс, но этоСложнее и сложнее. Одна из самых распространенных жалоб (включая мою собственную) состоит в том, что $ resource 'неВернуть обещание, которое сделало бы это подпоркой. Josh David Miller

Похожие вопросы