如何在{{}} AngularJS中使用JavaScript

Question

我知道{{}}可以解释表达式但是当我尝试在其中使用javascript时,它不起作用 {{"a/b/c/d/".split('/').filter(function(n){return n}).reverse()[0]}}

我需要使用它来从url获取slug值.

请建议如何使用angularjs实现这一点,url的来源是来自外部feed,因此我对此的控制非常有限.

Answer 1

不支持完整的JS,即便如此,这也是一种不好的做法.

我建议你至少将它放在控制器的示波器功能中.
更好的方法是将其放入服务或过滤器中,因此如果您希望以后将其重新用于其他目的,您可以:

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

然后,在您的模板中:

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

此外,阅读有关表达式的Angular文档也是有效的.

Answer 2

你不应该使用这样的模板 - 所以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>