Использование MEAN Stack - запрос MongoDB и передача значения как переменной

Question

Я использую стек MEAN для создания веб-приложения. У меня есть server.js, console.js, MongoDB, называемый «контактный список», и index.html, содержащий Javascript для древовидной диаграммы. То, что я хотел бы сделать, - это запросить мой MongoDB, скажем, ключ и вернуться с его значением (или действительно просто получить любую информацию). Я хотел бы сохранить это значение как переменную и передать его вместе с javascript, содержащимся в моем index.html.

Это ближайший я восстановил код учебника. Использование mongojs как мой водитель, у меня есть это в моем server.js:

app.get('/contactlist', function (req, res) { 
console.log("I received a GET request") 

db.contactlist.find({email:"bob11@email.com"},function(err, docs) { 
//looks at the contact list database for anything with the email of bob11@email.com 
    console.log(docs); 
    res.json(docs); 
}); 
}); 

В моем контроллере:

var myApp = angular.module('myApp', []); 
myApp.controller('AppCtrl', ['$scope', '$http', function($scope, $http) { 
console.log("Hello World from controller"); 

var refresh = function() { 
$http.get('/contactlist').success(function(response) { 
    console.log("I got the data I requested"); 
    $scope.contactlist = response; 
    $scope.contact = ""; 
}); 
}; 

Использование нг-повторе функции ниже является артефактом первоначальной заявки (отображает список всех контактов). Теперь мне просто нужно одно значение, но я не знаю, какую функцию использовать. Вот мой index.html:

<div class="container" ng-controller="AppCtrl"> 
    <table class="table"> 
     <thead> 
      <tr> 
     </thead> 
     <tbody> 
      <tr ng-repeat="contact in contactlist"> 
       <td>{{contact.name}}</td> 
       <!-- grabs the name from parameters set out in server.js --> 
      </tr> 
     </tbody> 
    </table> 
</div> 

Это показывает название ("Bob") по электронной почте я фильтруется для (bob11@email.com) на веб-странице. На этом этапе поможет даже просто сохранить это имя в качестве переменной и передать его в javascript. Ng-repeat определенно не то, что я хочу использовать, но я новичок в программировании и стеке MEAN, поэтому я как бы застрял.

Спасибо.

Answer 1

Я не совсем уверен, что вы спрашиваете, но я постараюсь помочь.

Если вы спрашиваете, как редактировать переменную contact.name на клиенте, вам, вероятно, стоит ознакомиться с Angular's two way data binding. Это означает, что любое изменение в $ scope в контроллере повлияет на данные, отображаемые в HTML, и любое изменение переменной в html будет применено к $ scope.

Например, если вы хотите отредактировать contact.name на странице, вы можете использовать текстовое поле ввода, связанное с contact.name в качестве своей модели. Для этого нам понадобится ng-model, чтобы создать мост между полем ввода и значением, которое мы хотим изменить. что может выглядеть как этот

<ul> 
    <li ng-repeat="contact in contactlist"> 
     Name: <input type="text" ng-model="contact.name"/> 
    </li> 
    </ul> 

Затем мы можем добавить атрибут ng-change к входу, чтобы выполнить действие изменения. See working demo here

Answer 2

Первое решение: вы можете использовать нг-инициализацию для вашей страницы HTML и связывания механизма что-то вроде этого

<div ng-init="param='value';"> 
    <div ng-controller="yourController" > 
     <label>param: {{value}}</label> 
    </div> 
</div> 

теперь любого параметра, который вы используете в HTML файл доступно для вашей функции контроллера

function yourController($scope) { 
     console.log($scope.param); 
} 

второе решение: вы можете сделать сервис для передачи значения в контроллер что-то вроде этого

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

app.factory('valuepassing', function() { 

    var myvaluepassingService = {}; 
     data =[]; 
    myvaluepassingService.addvalue = function(value) { 
     data.push(value); 
    }; 
    myvaluepassingService.removevalue = function(value) { 
     var index = data.indexOf(value); 
     data.splice(index, 1); 
    }; 
    myvaluepassingService.data = function() { 
     return data; 
    }; 

    return myvaluepassingService; 
}); 

function MyCtrl($scope, valuepassing) { 
    $scope.newvalue = {}; 
    $scope.valuepassing = valuepassing;  
}