Văn bản tuyệt vời 2: Đánh dấu ngôn ngữ khác nhau dựa trên ngữ cảnh? (a la Webstorm)

Question

Tôi đã xem một số video trên Egghead.io về AngularJS. Tác giả của video sử dụng Webstorm (và, tôi tin, làm việc cho họ). Một tính năng mà tôi nhận thấy là anh ấy có thể đặt tô sáng cú pháp khác nhau trong các phạm vi hoặc dấu ngoặc kép khác nhau. Vì vậy, trong mã như sau (từ một chỉ thị AngularJS)

return { 
    template: '<div>something</div>', 
    //   ^^^ these guys ^^^ 
} 

... anh ta có thể nhận được bên trong dấu ngoặc kép để đánh dấu là HTML.

Tôi sử dụng Nội dung tuyệt vời 2 và được gắn bó với nó. Có một tính năng/plugin hiện có cho Sublime có thể xử lý một trường hợp như thế này không? Nếu không, có phải cái gì đó về mặt kỹ thuật này có thể sử dụng API Sublime Text 2 không?

Answer 1

Tôi không nghĩ nó được tích hợp sẵn, nhưng chắc chắn là có thể. Tôi đã làm một số công việc với graphviz và muốn làm một cái gì đó tương tự. Nhãn có thể được tạo bằng cú pháp html. Dù sao, tôi chơi xung quanh với các tập tin .tmLanguage và thêm một mô hình mới để phù hợp với bối cảnh nơi html như mục đã hợp lệ (tôi tìm label = <). Các mẫu tôi sử dụng để chụp không phải là tốt, nhưng nó hoạt động tốt cho tôi. Điều này cho tôi những điều sau đây, mà tôi nghĩ là tương tự như những gì bạn đang tìm kiếm.

Tôi không biết gì về AngularJS, vì vậy tôi không thể giúp bạn với bất cứ điều gì cụ thể đó, nhưng chắc chắn là có thể. Lưu ý rằng trong hình bên dưới, <table></table> vừa qua chỉ để cho biết rằng việc đánh dấu không xảy ra ở đó.

Chỉnh sửa:

Hãy quên bao gồm điều này trong bài đăng gốc, nhưng đây là tệp tmLangauage được cập nhật của tôi. Mẫu đầu tiên đó là thứ tôi thêm vào (link). Tôi đã sử dụng PlistJsonConverter để chuyển từ JSON sang dạng plist, sau đó lưu tệp dưới dạng .tmLanguage. Hi vọng điêu nay co ich.

Answer 2

@skuroda đúng, tôi đã triển khai mã của @ skuroda với một plugin bổ sung để dễ dàng chỉnh sửa HTML trong tệp JS chỉ thị AngularJS. Kết quả là làm nổi bật cú pháp HTML trong tệp JS chỉ thị và chức năng bổ sung để xóa các dấu phân cách liên quan đến chuỗi trong khi chỉnh sửa mẫu .... Sublime AngularJS HTML Template Plugin