Пользовательский порядок в AngularJS без абсолютного сравнения строк?

Question

Я создаю небольшой beautifier CSS для моей системы, который будет собираться только тогда, когда CSS находится в определенном порядке.Идея состоит в том, чтобы выгружать CSS в текстовую область, а приложение генерировать упорядоченную версию кода.Мне удалось это сделать, но только если код, вставленный в область текста, не имеет свойств.

Например:

content
margin
font-size

Будет работать.

Но если это правильный код со свойствами:

content: 'test';
margin: 10px;
font-size: 1em;

Тогда этого не произойдет.

Я думаю, что неудача заключается в том, что сравнительная функция будет учитывать толькострока как полная, а не как частичная.

Вот сравнительная функция и a JS Bin .

$scope.customOrder = function (item) {
  switch (item) {
    case 'display':
        return 1;
    case 'flex':
        return 2;
    case 'flex-basis':
        return 3;
    case 'flex-direction':
        return 4;
    ... 
  }
};

Любые идеи о том, как решить эту проблему?

Answer 1

Перед switch проанализируйте имя атрибута, например:

$scope.customOrder = function (item) {
   var parsedItem = item.substr(0, item.indexOf(':'));
   switch (parsedItem) {
     case 'display':
       return 1;
      case 'flex':
        return 2;
      ...