将一个NodeJS Express对象传递给AngularJS 1.6
我有一个使用Express的工作NodeJS API。 我很困惑如何正确地传递一个参数从NodeJS AngularJS为了检索页面的数据。
注：我的问题是这个问题的扩展 （不是重复）： 如何将node.js服务器variables传递到我的angular度/ HTML视图？
我build立了两个path，一个是渲染页面，另一个是基于Book ID（实体的唯一ID）返回JSON对象。 当页面加载时，Angular使用$ http发送GET请求来从JSON端点获取数据。
这是行得通的，但我已经在Angular中硬编码了一个Book ID的例子。
问题：如何将书籍ID传递给angular度控制器？
/*EXPRESS ROUTES*/ //Render page router .route('/detail/:book_id') .get(ctrlRequest.detailPage); //Return JSON data router .route('/detail/json/:book_id') .get(ctrlRequest.detailJSON); /*NODEJS CONTROLLERS*/ //Render page module.exports.detailPage = function(req, res) { res.render('transfer_request_detail.pug', { title: 'Transfer Request Detail' }); }; //Return JSON data module.exports.detailJSON = function(req, res) { getModel().read(req.params.book_id, (err, entity) => { if (err) { console.log('Request Detail JSON unable to return data results. Error message: ', err); return; } else { res.json(entity); } }); }; /*ANGULAR WITH HARD-CODED BOOK ID*/ //QUESTION: HOW TO PASS THE BOOK ID IN DYNAMICALLY? function DetailPageController($http) { var vm = this; $http({ url: '/detail/json/5761233819297931', //HARD-CODED ID HOW TO PASS IN DYNAMICALLY? method: 'GET' }).then(function (response){ vm.book = response.data; console.log('API worked', response); },function (error){ console.log('API error: ', error); }); } 更新：
“这可能取决于您的应用程序的使用方式，例如，应用程序可能会显示从Express中提取的书籍列表，用户点击其中一个可以查看详细信息页面，在这种情况下，前端会提取Book ID的完整列表从Express开始，你能简单介绍一下你的应用程序的行为吗？“
使用案例1：用户提交新书forms后，Node应用程序将redirect到呈现详细信息页面的URL。 '/细节/：book_id'。 我想使用Angular来build立一个数据表来显示已经创build的书的细节。
使用案例2：将来的另一个用例是显示由login用户创build的所有书籍。 在这种情况下，我想使用Angular来显示数据表中的所有书籍。 路线将会像'/ mybooks /：username'。 另外，用户还应该能够点击一个链接，将其带到单个图书的详细信息页面（用例1）。
更新2：
我尝试使用routeParams从URL中提取ID。 这似乎正是我所需要的，但它不工作。 请注意，路由是在服务器端使用Express创build的，而不是Angular。
$routeParams //Object $routeParams.book_id //undefined
https://docs.angularjs.org/api/ngRoute/service/ $ routeParams
更新3：
我能够解决这个有点哈克解决方法。 我对这个解决scheme并不是非常满意，因为这个解决scheme相当不方便，但至less现在可以工作。
我在Angular控制器中使用这个代码从URL中提取ID。
var relpath = $location.path().split('/'); var book_id = relpath[3];
更新4：所以看起来我回到了原点。 这个解决scheme打破了快速路由。 我现在遇到了与此线程中描述的相同的问题，因为启用了locationProvider HTML模式以使此解决scheme起作用。 点击菜单链接时不会加载页面，只有在直接input时才加载。
在浏览器中直接访问URL时，angular度路由不起作用，但在点击后工作？
你可以使用模板文字 ：在你的urlstring中。
function DetailPageController($http, id = 5761233819297931) { var vm = this; $http({ url: `/detail/json/${id}`, //HARD-CODED ID HOW TO PASS IN DYNAMICALLY? method: 'GET' }).then(function (response){ vm.book = response.data; console.log('API worked', response); },function (error){ console.log('API error: ', error); });
}