0

我對angularjs有點新鮮。我有一個可以正常工作的服務。但是我想將模型(患者模型)從服務中移出並放入一個separtate JavaScript文件中。不太確定如何做到這一點。我猜我需要某種類型的工廠或服務?將模型移出服務

這是我patient.service.js

(function() { 
'use strict'; 

angular 
    .module('beincharge.patient') 
    .factory('patientDataService', patientDataService); 

patientDataService.$inject = ['$http']; 

function patientDataService($http) { 
    var service = { 
     getData: getData 
    }; 

    return service; 

    ////////// 

    function getData() { 
     // I would like to move this model into a separate js file 
     function patient(d) { 

      this.Status = d.Status; 
      this.ImageUrl = d.ImageUrl; 
      this.PersonId = d.PersonId; 
      this.LastName = d.LastName; 
      this.MiddleName = d.MiddleName; 
      this.FirstName = d.FirstName; 
     } 
     // end I would like to move this model into a separate js file 


     var data = [ 
      { 
       "Status": "Active", 
       "ImageUrl": "http://lorempixel.com/100/100/people/9/", 
       "PersonId": 1, 
       "LastName": "Pratt", 
       "MiddleName": "B", 
       "FirstName": "Allie" 
      }, 
      { 
       "Status": 'Active', 
       "ImageUrl": "http://lorempixel.com/100/100/people/3/", 
       "PersonId": 1, 
       "LastName": "Pratt", 
       "MiddleName": "B", 
       "FirstName": "Allie" 

      }]; 

      return getPatientList(data); 

      function getPatientList(data) { 
       var a = []; 
       angular.forEach(data, function (d, i) { 
        a.push(new patient(d)); 
       }) 
       return a; 
      } 



    } 
} 

所以我想給模型進入一個名爲patient.model.js

(function() { 
    function patient(d) { 
     this.Status = d.Status; 
     this.ImageUrl = d.ImageUrl; 
     this.PersonId = d.PersonId; 
     this.LastName = d.LastName; 
     this.MiddleName = d.MiddleName; 
     this.FirstName = d.FirstNa 
    } 
    return patient; 
}()); 
+0

不知道你想做什麼。大多數情況下,服務*都是這種情況下的模型。你已經有了一個處理數據幷包含業務邏輯的單元。 – estus

回答

1

你必須創建一個工廠供應商應該是這樣的:

angular 
    .module('beincharge.patient') 
    .factory('Patient', function() { 
     return function(d){ 
      this.Status = d.Status; 
      this.ImageUrl = d.ImageUrl; 
      this.PersonId = d.PersonId; 
      this.LastName = d.LastName; 
      this.MiddleName = d.MiddleName; 
      this.FirstName = d.FirstName 
     } 
    }); 

然後在第E服務,你可以使用這樣的:

angular 
    .module('beincharge.patient') 
    .factory('patientDataService', patientDataService); 

patientDataService.$inject = ['$http', 'Patient']; 

function patientDataService($http, Patient){ 
    console.log(new Patient({ Status: 'active' })); 
} 

你可以看到下面的完整的例子:

https://jsfiddle.net/9af3qys7/1/

+0

謝謝,看起來很像我以後。如果一切都看起來不錯,我會在今晚給它一個鏡頭,並獎勵賞金。 –

+0

效果很好,非常感謝。 –

0

,如果你想要的是一個模型您可以實例化並重用,然後在patientModel.js文件中創建一個如下所示的簡單JavaScript對象:

function PatientModel() { 
     this.Status = ""; 
     this.ImageUrl = ""; 
     this.PersonId = ""; 
     this.LastName = ""; 
     this.MiddleName = ""; 
     this.FirstName = ""; 
    } 

Make s此文件在要使用它的控制器或服務之前加載。

然後你可以實例化它是這樣的:

var patient = new PatientModel(); 

當然你改變的構造函數有一定的參數,如果這就是你所需要的,所以你可以通過任何你在你的d參數。

只要您需要的是一些簡單且可重複使用的模型,這將對您有用。好處是您可以繼續在測試中使用它們,而不是依賴硬編碼的json對象。

0

您正在嘗試在java風格中編寫javascript,我沒有看到有任何需要在此創建患者模型,您的病例中的響應/數據與患者對象完全相同。一個更加簡單的實現是

(function() { 
'use strict'; 

angular 
    .module('beincharge.patient') 
    .factory('patientDataService', patientDataService); 

patientDataService.$inject = ['$http']; 

function patientDataService($http) { 
    var service = { 
     getData: getData 
    }; 
    return service; 

    this.getData = function() { 
     var data = [ 
     { 
      "Status": "Active", 
      "ImageUrl": "http://lorempixel.com/100/100/people/9/", 
      "PersonId": 1, 
      "LastName": "Pratt", 
      "MiddleName": "B", 
      "FirstName": "Allie" 
     }, 
     { 
      "Status": 'Active', 
      "ImageUrl": "http://lorempixel.com/100/100/people/3/", 
      "PersonId": 1, 
      "LastName": "Pratt", 
      "MiddleName": "B", 
      "FirstName": "Allie" 

     }]; 
     return data; 
    }; 
} 
0

在這裏你可以移動app.service(..)到patient.model.js

var app = angular.module('beincharge_patient',[]); 
 

 
app.service('patientData',function(){ 
 
    var getP = function(d) { 
 
     this.Status = d.Status; 
 
     this.ImageUrl = d.ImageUrl; 
 
     this.PersonId = d.PersonId; 
 
     this.LastName = d.LastName; 
 
     this.MiddleName = d.MiddleName; 
 
     this.FirstName = d.FirstName; 
 
    } 
 
    var service = { 
 
     getP: getP 
 
    } 
 
    return service; 
 
}); 
 

 
app.factory('patientDataService',['$http','patientData',function($http,patientData){ 
 
    
 
    var getData = function() { 
 
     var data = [{ 
 
      "Status": "Active", 
 
      "ImageUrl": "http://lorempixel.com/100/100/people/9/", 
 
      "PersonId": 1, 
 
      "LastName": "Pratt", 
 
      "MiddleName": "B", 
 
      "FirstName": "Allie" 
 
     }, 
 
     { 
 
      "Status": 'Active', 
 
      "ImageUrl": "http://lorempixel.com/100/100/people/3/", 
 
      "PersonId": 1, 
 
      "LastName": "Pratt", 
 
      "MiddleName": "B", 
 
      "FirstName": "Allie" 
 
     } 
 
     ];  
 
     var getPatientList = function(data) { 
 
     var a = []; 
 
     angular.forEach(data, function (d, i) { 
 
      a.push(new patientData.getP(d)); 
 
     }) 
 
     return a; 
 
     } 
 
     return getPatientList(data); 
 
    } 
 
    var service = { 
 
     getData: getData 
 
    }; 
 
    return service; 
 
}]); 
 

 
app.controller('beincharge_patient_Controller', ['$scope','patientDataService',function($scope,patientDataService){ 
 
    $scope.temp=patientDataService.getData(); 
 
}]);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.11/angular.min.js"></script> 
 

 
<div ng-app="beincharge_patient" ng-controller="beincharge_patient_Controller"> 
 
    <br/> 
 
    {{temp}} 
 
</div>