0
RoRで角度jを設定するには、このチュートリアルhttps://thinkster.io/angular-railsに従っています。私はhome.htmlアセット/ javascripts/home/_home.htmlに存在する部分をレンダリングしていないので、ここで立ち往生しています。 _home.htmlにhtmlとangularを追加しても、ブラウザには空白の画面が表示されます。私を助けてくださいRoRで角度jを使用して何もレンダリングできない
app.js
angular.module('flapperNews', ['ui.router','templates'])
.config([
'$stateProvider',
'$urlRouterProvider',
function($stateProvider, $urlRouterProvider) {
$stateProvider
.state('home', {
url: '/home',
templateUrl: 'home/_home.html',
controller: 'MainCtrl',
resolve: {
postPromise: ['posts', function(posts){
return posts.getAll();
}]
}
})
.state('posts', {
url: '/posts/{id}',
templateUrl: 'posts/_posts.html',
controller: 'PostsCtrl'
});
$urlRouterProvider.otherwise('home');
}])
application.js
//= require jquery
//= require jquery_ujs
//= require angular
//= require angular-ui-router
//= require angular-rails-templates
//= require_tree .
_home.html
<script type="text/ng-template" id="/home.html">
<div class="page-header">
<h1>Flapper News</h1>
</div>
<div ng-repeat="post in posts | orderBy:'-upvotes'">
<span class="glyphicon glyphicon-thumbs-up"
ng-click="incrementUpvotes(post)"></span>
{{post.upvotes}}
<span style="font-size:20px; margin-left:10px;">
<a ng-show="post.link" href="{{post.link}}">
{{post.title}}
</a>
<span ng-hide="post.link">
{{post.title}}
</span>
</span>
<span>
<a href="#/posts/{{$index}}">Comments</a>
</span>
</div>
<form ng-submit="addPost()"
style="margin-top:30px;">
<h3>Add a new post</h3>
<div class="form-group">
<input type="text"
class="form-control"
placeholder="Title"
ng-model="title"></input>
</div>
<div class="form-group">
<input type="text"
class="form-control"
placeholder="Link"
ng-model="link"></input>
</div>
<button type="submit" class="btn btn-primary">Post</button>
</form>
</script>
application.html.erb
<head>
<title>Workspace</title>
<%= stylesheet_link_tag 'application', media: 'all'%>
<%= javascript_include_tag 'application'%>
<%= csrf_meta_tags %>
</head>
<body ng-app="flapperNews">
<div class="row">
<div class="col-md-6 col-md-offset-3">
<ui-view></ui-view>
</div>
</div>
</body>
ルート
ルートへ： 'アプリケーション＃角度'
application_controller.rb
def angular
render 'layouts/application'
end