Доступ к переменной Get в Угловой функции

Question

Я создаю приложение в узле express и angular js. Я передать переменную на мой взгляд, как следует ...

app.get('/profile', ensureAuthenticated, function(req, res){ 
    res.render('profile', { user: req.user }); 
}); 

я могу получить доступ к переменной, на мой взгляд, как это (нефрит) ...

h1 #{user} 

Но как я могу получить доступ к этой переменной от угловой функции в контроллере или директиве?

Answer 1

Это звучит так, как будто вы можете смешивать вещи не так идеально. Я думаю, что лучший способ сделать это - использовать $resource в Угловом коде для вызова/профиля и получения данных таким образом.

Подумайте об этом таким образом, вы просто использовали узел для создания веб-сервиса, теперь вы используете AngularJS для вызова веб-службы на уровне сервисов. Код для его вызова довольно прямолинейный и можно найти в документации, которую я связал.

Возможно, вы также захотите проверить FoodMe demo, это использует node.js в качестве уровня webservice и angularJS в качестве пользовательского интерфейса на стороне клиента точно так же, как вы его настраиваете.

Answer 2

Спасибо Джеймсу, демонстрация FoodMe выглядит как отличный учебный ресурс. Прочитав ваш ответ, это переместило мое мышление, достаточное для того, чтобы я придумал свое решение. Я добавлю его в качестве альтернативного ответа, просто потому, что код в комментариях сосать. Ради улучшения моего понимания того, как узел и углы могут работать вместе, возможно, вы или кто-то еще может быть любезным, чтобы прокомментировать, как наши два решения сравниваются, и почему и когда это может быть предпочтительнее.

В моем экспрессе app.js ...

app.get('/api/user', api.user); 

и в моем маршрутах/api.js ...

exports.user = function (req, res) { 
    res.json(req.user); 
}; 

, а затем в моем угловом контроллере ...

function profileCtrl($scope, $http) { 

    $http.get('/api/user/').success(function(data) { 
    $scope.user = data; 
    }); 
} 

Answer 3

Я написал сообщение в блоге об этой теме - How to pass JavaScript Variables from a server to Angular.

В итоге, у вас есть три варианта:

1. Используйте встроенные теги JavaScript (не рекомендуется)
2. Сделать запрос HTTTP (как вы показали в своем собственном растворе)
3. Использование ngInit

Вы можете прочитать о деталях в моем посте, и я покажу только последнее и, по моему мнению, самое умное решение.

Чтобы передать свой user объект из экспресса-сервера на угловой контроллер использовать ngInit директивы:

div(ng-controller="UserCtrl", ng-init="user= #{JSON.stringify(user)}") 

, который загружает содержимое в угловую сферу, и вы должны быть в состоянии получить доступ к нему внутри контроллеру, вызвав $scope.user ,

function UserCtrl($scope) { 
    console.log($scope.user); 
} 

Answer 4

ng-init является не способ загрузки/сохранения констант в угловые. Вводя, Угловой путь:

<script> 
    angular.module('$preloaded', []).constant('$preloaded', <%= preloaded %>) 
</script> 

Вы можете вводить $preloaded зависимости везде, где в коде и получить доступ к константе.

Answer 5

Это старый пост, но релевантный. Ответы Zemrico хороши, но их нужно обновлять, так как есть некоторые изменения в синтаксисе jade/pug. Во-первых, ссылка в его ответе сломана и должна быть

http://www.mircozeiss.com/how-to-pass-javascript-variables-from-a-server-to-angular

Если вы читаете сообщение в блоге, пожалуйста, обратите внимание, что следующий больше не работает, как мопс больше не принимают интерполяции в качестве атрибута.

div(ng-controller="UserCtrl", ng-init="user= #{JSON.stringify(user)}") 

Вместо этого, пожалуйста, используйте это.

div(ng-controller="UserCtrl", ng-init="user=" + JSON.stringify(user))