2014-07-14 1 views
0

fullstack.io의 튜토리얼을 통해 레일즈 및 Angular.js로 영화 예고편 사이트를 만들고 있습니다. Angular.js 코드에 문제가 있습니다. 구성 또는 컨트롤러를 추가합니다.새 컨트롤러 또는 구성을 추가 할 때 Angular.js 표현식이 중지됩니다.

나는 처음 것 I는 각 파일에 다음 설정을 추가하거나 컨트롤러 아래에 추가 할 때,

<!DOCTYPE html> 
<html lang="en" ng-app="poppopApp"> 
<head> 
<meta charset="utf-8"> 
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1"> 
<meta name="viewport" content="width=device-width, initial-scale=1.0"> 
<title><%= content_for?(:title) ? yield(:title) : "Poppop" %></title> 
<%= csrf_meta_tags %> 
<%= stylesheet_link_tag "application", :media => "all" %> 
</head> 
<body> 
<div class="navbar navbar-default"> 
    <div class="container"> 
     <div class="navbar-header"> 
      <a class="navbar-brand" href="#"> 
       <h1><a href="/"> Poppop! </a></h1> 
      </a> 
     </div> 
     <div class="navbar-collapse collapse"> 
      <ul class="nav navbar-nav navbar-right user-panel-container"> 
       <li class="active"> 

       </li> 
      </ul> 

     </div> 
    </div> 
</div> 

<div ng-view></div> 

<div ng-controller="MoviesController"> 
    <div class="container"> 
     <div class="row"> 
      <div ng-repeat="movie in movies" class="col-md-4 col-sm-5 col-xs-12"> 
       <div class="movie-container"> 
        <a href="/movie/{{movie.youtubeId}}"> 
         <div class="thumbnail"> 
          <div class="poster img-rounded"> 
           <img ng-src="{{movie.posterUrl}}" alt="{{movie.title}}" /> 
          </div> 
         </div> 
         <div class="title"> 
          {{movie.title}} ({{movie.released}}) 
         </div> 
        </a> 
        <a class="favorite" ng-click="addFavorite(movie)" ng-if="!movie.isFavorite"> 
        <span class="unfavorited-heart"> &#x2661;</span> Add Favorite 
        </a> 
        <a class="favorite" ng-click="removeFavorite(movie)" ng-if="movie.isFavorite"> 
        <span class="favorited-heart"> &#x2665;</span> Favorite 
        </a> 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 

<div id="f"> 
    <div class="container"> 
     <div class="row"> 
      <p>Created by NikSeth</p> 
     </div> 
    </div> 
</div> 

<%= javascript_include_tag "application" %> 
</body> 
</html> 

그러나 다음과 같은 HTML과 잘 작동

angular.module('poppopApp', ['ngRoute']) 
.controller('MoviesController', ["$scope", 
function($scope) { 
    $scope.movies = [ 
     { 
      youtubeId: "8Eg6yIwP2vs", 
      title: "The Royal Tenenbaums", 
      released: "2001", 
      rated: "R", 
      runningTime: 92, 
      isFavorite: true, 
      posterUrl: "" 
     }, 
     { 
      youtubeId: "lgo3Hb5vWLE", 
      title: "Requiem for a Dream", 
      released: "2000", 
      rated: "R", 
      runningTime: 102, 
      isFavorite: false, 
      posterUrl: "" 
     } 
    ]; 
}]); 

.controller('MovieController', function($scope) { 
    console.log('MovieController is working'); 
}); 

, 각 표현을했다 페이지에서 렌더링을 중단하십시오.

config(function($routeProvider, $locationProvider) { 
$routeProvider 
    .when('/', 
    { 
    controller: 'MoviesController', 
    templateUrl: '/templates/movies.html' 
    }) 
    .otherwise({redirectTo: '/'}); 
$locationProvider.html5Mode(true); 
}); 

이것은 내가 추가 한 컨트롤러입니다.

.controller('MovieController', function($scope) { 
    console.log('MovieController is working'); 
}); 

미리 감사드립니다.

+0

당신이에 로딩 될 때까지'/ movies.html'에 대한 템플릿을 정의 있나요? – Kousha

+0

은 설정하기 전에 점을 놓친 오타입니다? – Dinesh

+0

문제가 해결 되었습니까? – ForgetfulFellow

답변

0

나는 하나의 문제는 설정에서 MoviesControllerMovieController해야한다고 생각 :

.when('/', 
    { 
    controller: 'MoviesController', <------------ 
    templateUrl: '/templates/movies.html' 
    }) 

... 


.controller('MovieController', function($scope) { <----------- 
    console.log('MovieController is working'); 
}); 
관련 문제