2016-05-22 7 views
-1

Привет, я сейчас работаю над демонстрационным приложением и im, работающим сейчас на рубине на рельсах, я хочу реализовать угловой материал для моего переднего конца, но при импорте angular.js и angular.css вот так , <%= stylesheet_link_tag 'application', media: 'all'%> <%= javascript_include_tag 'application', media: 'all'%>Угловой материал, не работающий в Ruby on rails

и мое приложение.js состоят из.

//= require jquery //= require jquery_ujs //= require turbolinks //= require_tree . //= require angular-material

и мой application.css имеет.

*= require_self *= require_tree . *= require angular-material

при попытке использовать образец на кнопку углового материала. он отображает только текст. например кнопку.

<!DOCTYPE html> 
    <html lang="en"> 
    <head> 
    <meta charset="UTF-8"> 
    <%= stylesheet_link_tag 'application', media: 'all'%> 
    <%= javascript_include_tag 'application', media: 'all'%> 
    <%= csrf_meta_tags %> 
    <title>DEMO RUBY ON RAILS</title> 
    <h2>DEMO RUBY ON RAILS</h2> 
     <p>HELLO <%= @name %></p> 
     <%= link_to('HELLO INDEX RUBY',{:action => 'hello'})%><br/> 
     <%= link_to('HELLO WITH PARAMETERS RUBY',{:action => 'hello', :page =>5, :id=>20})%> 
     <md-button md-no-ink class="md-primary">Primary (md-noink)</md-button 
    </head> 
    <body> 
    </body> 
    </html> 

только отображает кнопку с текстом Primary. он сам не отображает кнопку.

enter image description here

я действительно ценю ваши ответы. спасибо

+0

Есть ли какие-либо ошибки на консоли? – Sajeetharan

+0

Нет, это странная часть. он также успешно загружает следующие js и cs. ? CSS семья = Roboto: 300,400,500,700,400italic угловой material.min.css docs.css угловой logo.svg preload.js angular.min.js угловой animate.min.js угловой маршрут .min.js углового material.min.js docs.js углового messages.min.js углового-aria.min.js Docs-демо-scripts.js –

ответ

0

Я видел, что проблема с turbolink не играет хорошо с JQuery. Один из моих колледжей имел проблему с интеграцией дизайна material для проекта рельсов с turbolinks.

Так попробуйте удалить turbolinks из обоих application.css и application.js

Удалить //= require turbolinks из application.js

+0

это все то же. ничего не произошло –

+0

Я вижу, что ваш тег кнопки не закрыт ' ', если это то же самое в коде, попробуйте его исправить – sameera207

+0

Закрыто. это просто опечатка. –