如果嵌入需要适当的支撑嵌套,如何在Ace编辑器中执行嵌入式突出显示?

时间:2014-07-10 10:39:34

标签: ace-editor

考虑以下Razor代码:

<div>@(Model.GetSomething())</div>

显然,如果考虑所有括号,只能正确识别剃刀块 如果我做天真的嵌入(基于PHP的作用):

var RazorLangHighlightRules = function() {
    CSharpHighlightRules.call(this);
};

oop.inherits(RazorLangHighlightRules, CSharpHighlightRules);

var RazorHighlightRules = function() {
    HtmlHighlightRules.call(this);

    var razorStartRules = [{
        token : "meta.block-marker.razor",
        regex : "@\\(",
        push  : "csharp-start"
    }];

    var endRules = [{
        token : "meta.block-marker.razor",
        regex : "\\)",
        next  : "pop"
    }];

    console.log(this.$rules);
    for (var key in this.$rules)
        this.$rules[key].unshift.apply(this.$rules[key], razorStartRules);

    this.embedRules(RazorLangHighlightRules, "csharp-", endRules, ["start"]);
    this.normalizeRules();
};

oop.inherits(RazorHighlightRules, HtmlHighlightRules);

我从)获得第一个GetSomething()被识别为Razor块的右括号,这是不正确的。

在Ace中这样做的正确方法是什么?

1 个答案:

答案 0 :(得分:3)

您需要为每个(添加一个状态进行堆叠,并为)删除

endRules = [{ 
    regex: "[()]",
    onMatch: function(val, state, stack) {
        this.next = "";
        console.log(stack, this.next, val);
        if (val == "(") {
            stack.unshift("csharp-start", state);
            return "paren";
        }
        // val == ")"
        stack.shift();
        this.next = stack.shift() || "start";
        return this.next == "csharp-start" ? "paren" : "meta.block-marker.razor";
    }
}]

另见Add Javascript into Custom Language - ACE Editor