Данные из класса Rails в angularjs?

1

Я создал Rails-приложение с Embedded Ruby (erb) в качестве механизма шаблона, я использовал "twitter" gem, чтобы поговорить с Twitter API, и создал класс рельсов (например, TwitterAPi, внутри папки "Lib"). Я успешно передал данные в свой шаблон home.html.erb, например:

 <ul>
        <% TwitterApi.get_ronaldo_tweets.each do |tweet|%>
        <li><%=  tweet %></li>
        <% end %>
   </ul>

Как я уже сказал, TwitterApi - это класс, который я создал, и get_ronaldo_tweets - это метод, в котором я вытягиваю временную шкалу ronaldo и делюсь ею на своей странице. (Я использовал проверку подлинности только для приложений)

Итак, теперь я хочу использовать Angularjs на frontend, так что мой вопрос в том, возможно ли (и если да, как это делается?) Использовать этот класс Rails с Angular для получения того же результата?

Теги:
twitter

1 ответ

0
Лучший ответ

Сначала вам нужно действие контроллера Rails, чтобы отобразить твиты как JSON, чтобы Angular мог их загрузить. Я рекомендую вам создать TweetsController и просто использовать действие индекса:

class TweetsController < ApplicationController

  def index

    @tweets = TwitterApi.get_ronaldo_tweets

    respond_to do |format|
      format.html
      format.json { @tweets.to_json }
    end
  end

end

Не забудьте указать маршрут в route.rb:

resources :tweets, only: :index

Возможно, вам не нужно отвечать на HTML здесь, но вы можете просмотреть твиты, как вы сейчас делаете в home.html.erb.

Теперь вы должны увидеть Tweets JSON, выбрав:

localhost:3000/tweets.json

Я просто использую to_json для выгрузки json-данных, но вы можете рассмотреть jbuilder или rabl для рендеринга твитов.

Когда у вас есть данные json, вы можете использовать ngResource для загрузки твитов.

Вот какой-то непроверенный AngularJS в CoffeeScript, который, надеюсь, заставит вас начать:

app = angular.module("RonaldoTweets", ["ngResource"])

app.factory "Tweets", ["$resource", ($resource) ->
  $resource("/tweets.json")
]

@TweetCtrl = ["$scope", "Tweet", ($scope, Tweet) ->
  $scope.tweets = Tweet.query()

Наконец, вам просто нужен угловой вид для отображения твитов. Что-то вроде этого должно работать:

<div ng-controller="TweetCtrl">

  <ul>
    <li ng-repeat="tweet in tweets">
      {{tweet}}
    </li>
  </ul>

</div>

Этот RailsCast объясняет, как подключить приложение AngularJS к ресурсу Rails с помощью ngResource. Я рекомендую вам взглянуть. Единственное отличие здесь заключается в том, что вы не вытаскиваете Tweets из модели Rails, вы захватываете их из своего класса TwitterApi Ruby.

  • 0
    Большое спасибо, звучит как хорошая идея, спасибо за усилия!
  • 0
    работает как шарм, ура!
Показать ещё 4 комментария

Ещё вопросы

Сообщество Overcoder
Наверх
Меню