简体   繁体   English

无法从api控制器js文件中获取数据以使用Vue.js应用程序查看sails js中的ejs文件

[英]unable to get data from api controller js file to view ejs file in sails js with Vue.js app

I am working on Sails (latest version 1.x) with Vue.js application, and in my names.page.js , I have我正在使用 Vue.js 应用程序开发 Sails(最新版本 1.x),在我的names.page.js ,我有

data: { names : [], //… } , data: { names : [], //… }

beforeMount: function() { 
// Attach any initial data from the server.
 _.extend(this, SAILS_LOCALS);
 this.names = [{id: 1, name: 'abc'}, {id:2, name: 'xyz'}]
 },

Which I could able to successfully get in names.ejs and display the names array of objects.我可以成功进入names.ejs并显示对象的名称数组。

<pre>{{names}}</pre>

Now I have removed the this.names = [{id: 1, name: 'abc'}, {id:2, name: 'xyz'}] code from names.page.js and moved to view-names.js , and is as shown below:我现在已经除去this.names = [{id: 1, name: 'abc'}, {id:2, name: 'xyz'}]从代码names.page.js并移动到view-names.js ,如下图所示:

 fn: async function () {
    var sampleNames = [{id: 1, name: ‘abc’}, {id:2, name: ‘xyz’}]
    // Respond with view.
    return {
    names : sampleNames
    }

    }

but in my names.ejs when I give <pre>{{names}}</pre> , I am getting output as empty array [] , the actual names data ( array of objects) is not getting displayed.但是在我的 names.ejs 中,当我给出<pre>{{names}}</pre> ,我得到的输出为空数组[] ,实际的名称数据(对象数组)没有显示出来。 Can any one help me where I am going wrong.任何人都可以帮助我哪里出错了。

view-names.js seems like an action so it doesn't send data to the ejs template directly. view-names.js 看起来像是一个动作,所以它不会直接将数据发送到 ejs 模板。

You have to use the names.page.js which is the page instance for the names.ejs view.您必须使用 names.page.js,它是 names.ejs 视图的页面实例。

You can work with the sampleNames in the action then send the result to a names.page.ejs variable which in turn is accessible from within the view names.ejs您可以在操作中使用 sampleNames,然后将结果发送到 names.page.ejs 变量,而该变量又可以从视图 names.ejs 中访问

Sure,当然,

Build your variable first and send it to the page instance首先构建您的变量并将其发送到页面实例

view-names.js: names = [{id: 1, name: 'abc'}, {id:2, name: 'xyz'}] return { mynames: names } view-names.js: names = [{id: 1, name: 'abc'}, {id:2, name: 'xyz'}] return { mynames: names }

names.page.js (page instance) You have the variable set in the data data: { mynames: {} } names.page.js(页面实例)您在数据data: { mynames: {} }设置了变量data: { mynames: {} }

names gets populate from the action view-names.js名称从操作 view-names.js 中填充

Now you can work with it in the view, like for example in a v-for loop现在您可以在视图中使用它,例如在 v-for 循环中

<ul v-for="name in names"> <li>{{ name }}</li> </ul>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM