Index.js.erb文件在rails 5.1中不起作用

时间:2017-09-13 15:45:33

标签: javascript ruby-on-rails rubygems ruby-on-rails-5

我正在关注devfactor.com的教程。它被称为"让我们建立:带有Rails的Instagram。"作者在本教程中使用了AJAX和js文件。添加名为" Index.js.erb"的文件时,它在我的服务器中显示了许多错误。 错误:

ActionView::Template::Error (Missing partial posts/_posts, application/_posts wi
th {:locale=>[:en], :formats=>[:js, :html], :variants=>[], :handlers=>[:raw, :er
b, :html, :builder, :ruby, :coffee, :jbuilder]}. Searched in:
  * "C:/Users/alouftur0/Rails/Photogram/app/views"
  * "C:/Ruby23-x64/lib/ruby/gems/2.3.0/gems/kaminari-core-1.0.1/app/views"
  * "C:/Ruby23-x64/lib/ruby/gems/2.3.0/gems/devise-4.3.0/app/views"
):
    1: $('#posts').append("<%= escape_javascript(render 'posts')%>");
    2: $('#paginator').html("<%= escape_javascript(link_to_next_page(@posts, 'LO
AD MORE', remote: true, id: 'load_more'))%>");
    3: if (!$('#load_more').length) { $('#paginator').remove(); }

app/views/posts/index.js.erb:1:in `_app_views_posts_index_js_erb___1182481000_10
4067220'

以下是文件:

application.html.erb:

<!DOCTYPE html>
<html>
  <head>
    <title>Photogram</title>
    <%= csrf_meta_tags %>

    <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track': 'reload' %>
    <%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
  </head>

  <body>
  <%= render 'posts/navbar' %>
  <% flash.each do |key, value| %>
    <div class="alert alert-<%= key %>"><%= value %></div>
  <% end %>
  <%= yield %>
  </body>
</html>

Index.html.erb:

<% @posts.each do |post| %>
  <%= render 'post', post: post %>
<% end %>
<div class="text-center" id="paginator">
  <%= link_to_next_page @posts, 'LOAD MORE', remote: true, id: 'load_more' %>
</div>

index.js.erb的:

$('#posts').append("<%= escape_javascript(render 'posts')%>");
$('#paginator').html("<%= escape_javascript(link_to_next_page(@posts, 'LOAD MORE', remote: true, id: 'load_more'))%>");
if (!$('#load_more').length) { $('#paginator').remove(); }

application.scss:

/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS/SCSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *
 *= require_tree .
 *= require_self
 */
 @import "bootstrap-sprockets";
 @import "bootstrap";

的application.js:

// This is a manifest file that'll be compiled into application.js, which will include all the files
// listed below.
//
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, or any plugin's
// vendor/assets/javascripts directory can be referenced here using a relative path.
//
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
// compiled file. JavaScript code in this file should be added after the last require_* statement.
//
// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details
// about supported directives.
//
//= require rails-ujs
//= require turbolinks
//= require_tree 

那就是它。错误消息在上面。如果您有任何疑问,请发表评论。谢谢!  这是我的帖子控制器:

class PostsController < ApplicationController
    before_action :set_post, only: [:show, :edit, :update, :destroy]
    before_action :authenticate_user!
    before_action :owned_post, only: [:edit, :update, :destroy]
    def index
      @posts = Post.all.order('created_at DESC').page params[:page]
      respond_to do |format|
        format.js
        format.html
      end
    end

    def show
    end

    def new
      @post = current_user.posts.build
    end

    def create
      @post = current_user.posts.build(post_params)
      if @post.save
        redirect_to posts_path
        flash[:success] = "Post Created!"
      else
        flash.now[:success] = "Your new post couldn't be created!  Please check the form."
        render :new
      end
    end

    def edit
    end

    def update
      if @post.update(post_params)
        redirect_to posts_path
      else
        flash.now[:alert] = "Update failed.  Please check the form."
        render :edit
      end
    end

    def destroy
      @post.destroy
      redirect_to root_path
      flash[:success] = "Destroyed ;)"
    end

    private

    def owned_post
      unless current_user == @post.user
        flash[:success]= "That post doesn't belong to you :("
        redirect_to root_path
      end
    end

    def post_params
      params.require(:post).permit(:image, :caption)
    end

    def set_post
      @post = Post.find(params[:id])
    end
  end

2 个答案:

答案 0 :(得分:0)

您需要渲染部分内容,例如

$('#posts').append('<%= escape_javascript(render @posts) %>');

答案 1 :(得分:0)

index.html.erb#posts文件缺少$('#posts').append('<%= escape_javascript(render @posts) %>')选项卡中index.js.erb附加的<div id="posts"> <%= render 'posts' %> </div> <div class="text-center" id="paginator"> <%= link_to_next_page @posts, 'LOAD MORE', remote: true, id: 'load_more' %> </div> 附加信息。

posts/_post.html.erb

如错误所示,您还需要vagrant ssh-config > config.txt scp -F config.txt default:/path/to/file . 部分,这是JS部分尝试呈现的内容。