2013-12-19 3 views
8

Я знаю, что {{}} может интерпретировать выражение, но когда я пытаюсь использовать JavaScript в нем, он не работает, как {{"a/b/c/d/".split('/').filter(function(n){return n}).reverse()[0]}}Как использовать JavaScript внутри {{}} AngularJS

мне нужно использовать это получить значение slug из url.

Просьба предложить, как достичь этого с помощью angularjs, источник URL-адреса от внешнего источника, поэтому у меня есть очень ограниченный контроль над этим.

+1

хороший вопрос .. . То, что мне нужно. –

+2

Вы лучше вставляете его в функцию модели, например 'getSlug()' и используете его как '{{item.getSlug()}}'. Это более последовательный способ – oxfn

+2

Вы не можете и не должны. См. [Угловые выражения или выражения JS] (http://docs.angularjs.org/guide/expression), или, по крайней мере, вы не можете ожидать, что какой-либо произвольный javascript будет работать. * ... Если, с другой стороны, вы хотите запустить произвольный код JavaScript, вы должны сделать его методом контроллера и вызвать метод. Если вы хотите, чтобы eval() вызывало угловое выражение из JavaScript, используйте метод $ eval(). * – Yoshi

ответ

7

Полный JS не поддерживается, и даже это было бы, это была бы плохая практика.

Я рекомендую вам поместить это, по крайней мере, в функцию области действия в вашем контроллере.
Еще лучше было бы поставить его в службу или в фильтре, так что если вы хотите использовать его в дальнейшем для других целей вы можете:

$scope.getSlug = function(str) { 
    return str.split("/").filter(function(n) { 
    return n; 
    }).reverse()[ 0 ]; 
}; 

А потом, в шаблоне:

{{ getSlug("a/b/c/d/") }} 
{{ getSlug(myModelProperty) }} 

Кроме того, можно ознакомиться с Angular docs about expressions.

+0

но как бы я использовал это в {{}} на html ?? – whizcreed

+0

отредактировано, чтобы включить его – gustavohenke

+1

Bravo .. именно то, что я искал .. muchas gracias .. amigo: D – whizcreed

2

{{}} Сообщите Угловому, что, на ваш взгляд, у вас есть выражение для интерполяции. Угловые выражения не поддерживают весь JavaScript. Для документации check here.

Если вам нужен весь JavaScript. Лучше обернуть логику в функции контроллера.

Выдержка из документации:

Это может быть заманчиво думать угловые выражения зрения, как JavaScript выражения, но это не совсем правильно, так как Угловые не использует Eval() в JavaScript для вычисления выражений , Вы можете думать угловых выражений, как выражения JavaScript с следующими отличиями:

Атрибут Оценка: оценка всех свойств являются против объема делает оценку, в отличие от JavaScript, где выражения вычисляются против глобального окна ,

прощающий: оценка выражение снисходительным к неопределенным и нулевым, в отличие от JavaScript, где пытаются оценить неопределенные свойства может генерировать ReferenceError или TypeError.

Нет Контроль поток Заявления: вы не можете сделать одно из следующих действий в угловом выражении: условные, петли, или выбросить.

5

Вы не должны использовать шаблоны, подобные этому, поэтому Angular не поддерживает его.Либо создать функцию в области видимости:

$scope.getSlug = function (input) { 
    return input.split('/').filter(function(n){return n}).reverse()[0]; 
} 

Или создать фильтр, который делает то, что вы хотите для того чтобы достигнуть:

angular.module('myModule').filter('myFilter', function() { 

    return function (input) { 
     if (!input) return input; 

     return input.split('/').filter(function(n){return n}).reverse()[0]; 
    }; 
}); 

И использовать его как это:

<div>{{"a/b/c/d" | myFilter}}</div> 
Смежные вопросы