未初始化的常量Object :: Opal中的元素RB

在Opal/JQuery中試用我的手。我的app.rb文件如下所示：未初始化的常量Object :: Opal中的元素RB

require 'opal' 
require 'opal-jquery' 

class HTMLObject 
    def initialize 

    end 

    def write_to_body 

    end 
end 


class HTMLParagraph < HTMLObject 
    attr_accessor :inner_html 
    def initialize(text) 
    @inner_html= text 
    end 

    def write_to_body 

    @body = Element.find("#body") 
    @body.append(Element("<p>#{@inner_html}")) 
    end 
end 

p = HTMLParagraph.new("hello world") 
p.write_to_body

我使用從站點到app.js的示例進行編譯。我使用index.html在我的網絡瀏覽器中運行它：

<!DOCTYPE html> 
<html> 
<head> 
    <script src="jquery-1.10.1.min.js" type="text/javascript"></script> 
    <script src="opal.js" type="text/javascript"></script> 
    <script src="opal-jquery.min.js" type="text/javascript"></script> 
    <script src="opal-parser.js" type="text/javascript"></script> 
    <script src="app.js" type="text/javascript"></script> 
    <title></title> 
</head> 
<body> 

</body> 
</html>

當我打開頁面時，我什麼都看不到。控制檯顯示了這一錯誤跟蹤：

Uncaught NameError: uninitialized constant Object::Element opal.js:1531 
def.$backtrace.backtrace opal.js:1531 
def.$raise opal.js:1279 
def.$const_missing opal.js:575 
Opal.cm opal.js:255 
def.$write_to_body app.js:44 
(anonymous function) app.js:51 
(anonymous function)

的JS輸出文件讀取這樣的：

function(__opal) { 
    var p = nil, _a, _b, self = __opal.top, __scope = __opal, nil = __opal.nil, $mm = __opal.mm, __breaker = __opal.breaker, __slice = __opal.slice, __klass = __opal.klass; 
    (function(__base, __super){ 
    function HTMLObject() {}; 
    HTMLObject = __klass(__base, __super, "HTMLObject", HTMLObject); 

    var def = HTMLObject.prototype, __scope = HTMLObject._scope; 

    def.$initialize = function() { 

     return nil; 
    }; 

    def.$write_to_body = function() { 

     return nil; 
    }; 

    return nil; 
    })(self, null); 
    (function(__base, __super){ 
    function HTMLParagraph() {}; 
    HTMLParagraph = __klass(__base, __super, "HTMLParagraph", HTMLParagraph); 

    var def = HTMLParagraph.prototype, __scope = HTMLParagraph._scope; 
    def.inner_html = def.body = nil; 

    def.$inner_html = function() { 

     return this.inner_html 
    }, 
    def['$inner_html='] = function(val) { 

     return this.inner_html = val 
    }, nil; 

    def.$initialize = function(text) { 

     return this.inner_html = text; 
    }; 

    def.$write_to_body = function() { 
     var _a, _b, _c; 
     this.body = ((_a = ((_b = __scope.Element) == null ? __opal.cm("Element") : _b)).$find || $mm('find')).call(_a, "#body"); 
     return ((_b = this.body).$append || $mm('append')).call(_b, ((_c = this).$Element || $mm('Element')).call(_c, "<p>" + (this.inner_html))); 
    }; 

    return nil; 
    })(self, ((_a = __scope.HTMLObject) == null ? __opal.cm("HTMLObject") : _a)); 
    p = ((_a = ((_b = __scope.HTMLParagraph) == null ? __opal.cm("HTMLParagraph") : _b)).$new || $mm('new')).call(_a, "hello world"); 
    return ((_b = p).$write_to_body || $mm('write_to_body')).call(_b); 
})(Opal);

任何想法？

來源

2013-05-18 RedMage