簡體   English   中英

如何從mongodb獲取值到angularjs控制器

[英]How can I get a value from mongodb to an angularjs controller

我是Web開發的新手,並開始使用MEAN-Stack(Mongo,Express,Angular,Node)。

簡而言之 ,我想從mongo中獲取一個值到我的角度控制器中,以使用mongo中的多個值,如下所示:

value11*value12 + value21*value22 ...etc

我的問題更詳細:

  1. 我已經用字段集寫了一些數據到mongo:

HTML代碼段

<fieldset>
<rzslider rz-slider-model="value11"
          rz-slider-options="slider11.options"></rzslider>
<md-slider flex md-discrete ng-model="value12" step="1" min="1 max="100 aria-label="rating"></md-slider
</fieldset>

Controller.js片段。 rzslider來自https://github.com/angular-slider/angularjs-slider
來自Angular-Material的md滑塊

$scope.slider11 = { 
  options: { 
    showTicks: true,
    hidePointerLabels: true,
    hideLimitLabels: true,
    stepsArray: [
      { value: 1, legend: 'Very poor' }
      { value: 2, legend: 'Poor' },
      { value: 3, legend: 'Fair' },
      { value: 4, legend: 'Good' }, 
      { value: 5, legend: 'Very Good' }
    ] 
  }
};
$scope.value12 = 40;
//Create new Article object
var article = new Articles
  value11: this.value11,
  value12: this.value12,

此時一切正常,在mongo中存儲設定值。

  1. 在第二步中,我希望將數據庫中的值轉換為不同的控制器,以將它們包含在上述公式中。 到目前為止唯一可行的方法是直接在html視圖中調用這樣的值:

HTML代碼段

{{article.value11 * article.value12}}

這是有效的,據我所知,多虧了下面的查詢。

控制器片段

// Find a list of Articles
$scope.find = function () {
$scope.articles = Articles.query();
};

但最終我想回憶一下數據庫值並將它們定義為控制器中的新$ scope。

所以整個MEAN堆棧背后的想法以及或多或少的整個前端/后端想法是你的角度應用程序是前端,你需要對你的Node.js服務進行AJAX調用以連接到MongoDB

可以把它想象成Angular <---AJAX---> Node <------> Mongo

所以你需要的第一件事就是建立一個休息服務(使用快速框架的幫助),這樣的事情就可以了

app.get('/getMongoData', function(req, res, next) {
     //code to get mongo data with Mongoose

     req.json(DataFromMongo); //returns the data in json format
}); 

在這里,您將使用后端代碼使用Mongoose包從Mongo數據庫中獲取數據,並使用req.json()調用返回發送回來,該調用是Express的一部分

現在這一切都可以工作,你可以通過類似的方式調用Angular控制器中的數據

$http.get('/getMongoData').then(function(response) {
      $scope.myMongoData = response.data;       
});

注意:不要忘記將$http添加到控制器的注入app.controller('MyController', ['$scope', '$http', function ($scope, $http) { // code }]);

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM