Sublime Forum

Syntax highlighting to recognise "$scope" in Angularjs

#1

Wherever I look at Angularjs code in code example screenshots, people making tutorials on Youtube etc, the dollar + string syntax (for example $scope or $routeProvider) always has the dollar sign in a different color. For example a
$scope will have a red-colored dollar sign, and a white-colored scope string (in Monokai color scheme).
Example: http://www.concretesolutions.com.br/blog/wp-content/uploads/2015/07/1.png

I like that, because it’s so much clearer to go through the code and find all the $scope declarations or invocations. But to me, the entire $scope string is always all white. I’ve tried different color schemes, but the $ sign is always the same color as the rest of the string. I’ve tried searching for packages that might have something like angular syntax highlight in the name, but found none.

What is the thing that I need to do, to just get that little detail to work?

0 Likes
#2

It’s up to the colour scheme (*.tmTheme) to provide a colour for it.
I have my own custom scheme and I have this:

<dict>
    <key>scope</key>
    <string>source.js punctuation.dollar</string>
    <key>settings</key>
    <dict>
        <key>foreground</key>
        <string>#dc143c</string>
    </dict>
</dict>
2 Likes
#3

Well first of all, thank you!!
And would you by any chance know how to make the same thing work for PHP code?

0 Likes
#4

With ctrl+alt+shift+p ("show_scope_name" command in the default keybinds, might be different depending on OS) you can find out the scope needed.

For PHP that would be punctuation.definition.variable.php, so the code becomes:

<dict>
    <key>scope</key>
    <string>punctuation.definition.variable.php</string>
    <key>settings</key>
    <dict>
        <key>foreground</key>
        <string>#dc143c</string>
    </dict>
</dict>
3 Likes