Я создал 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 для получения того же результата?
Сначала вам нужно действие контроллера 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.