在Rails应用程序的Haml视图中使用AngularJS

Question

我有一个Haml视图的Rails应用程序。现在我想将AngularJS添加到应用程序的某些部分，但问题是Haml视图呈现在服务器端，AngularJS代码无法正常工作，因为它呈现在客户端。

比方说，我刚才这在我的index.html.haml：

!!! 
%html{"ng-app" => "Test"} 
    %head 
    %script{:src => "http://ajax.googleapis.com/ajax/libs/angularjs/1.0.3/angular.js"} 
    :javascript 
     function Clock($scope) { 
     $scope.currentTime = new Date(); 
     } 
    %title Welcome to AngularJS 
    %body 
    %h1 Hello, World. 
    %p{"ng-controller" => "Clock"} 
     The current time is {{currentTime | date:'h:mm:ss a'}}. 

所以目前，它只是打印出来的花括号内的所有内容，而不实际处理它。有解决方案，但它们适用于您的完整视图被AngularJS模板所取代的情况。我想在我的Rails应用程序中主要使用AngularJS来实现小功能。任何想法如何解决这个问题？

Answer 1

约翰，

我编辑了自己的代码位的位置：http://codepen.io/anon/pen/vKiwH

%html{"ng-app"=>true} 
%p{"ng-controller" => "clock"} 
    The current time is {{currentTime | date:'h:mm:ss a'}}. 

和JavaScript是：

function clock($scope) { 
    $scope.currentTime = new Date().getTime(); 
}