Regression: Custom filters no longer work with ng-bind-html directive #571
Description
Angular Version: 0.9.7. I am not sure what previous version I was using when this used to work but it broke sometime in the last 2-3 weeks.
Using custom filter with ng-bind-html directive causes the following error:
No NgFilter: test_filter found!
STACKTRACE:
#0 _DefaultFilterMap.call (package:angular/core/parser/syntax.dart:210:17)
#1 Filter.eval (package:angular/core/parser/eval.dart:30:29)
#2 DynamicExpression.eval (package:angular/core/parser/dynamic_parser.dart:51:30)
#3 DynamicExpression.eval (package:angular/core/parser/dynamic_parser.dart:52:7)
#4 Compiler.createMappings... (package:angular/core_dom/compiler.dart:181:42)
#5 relaxFnArgs2. (package:angular/utils.dart:50:47)
#6 Scope._digestComputeLastDirty (package:angular/core/scope.dart:562:30)
#7 Scope._digestWhileDirtyLoop (package:angular/core/scope.dart:489:52)
#8 Scope.$digest (package:angular/core/scope.dart:475:28)
#9 _autoDigestOnTurnDone (package:angular/core/scope.dart:153:14)
#10 _rootRun (dart:async/zone.dart:710)
#11 _ZoneDelegate.run (dart:async/zone.dart:440)
#12 NgZone._finishTurn (package:angular/core/zone.dart:91:21)
#13 NgZone._onRunBase (package:angular/core/zone.dart:56:43)
#14 _onRun (package:angular/core/zone.dart:61:15)
#15 _ZoneDelegate.run (dart:async/zone.dart:440)
#16 _CustomizedZone.run (dart:async/zone.dart:650)
#17 NgZone.run (package:angular/core/zone.dart:143:27)
#18 ngBootstrap (package:angular/bootstrap.dart:87:18)
#19 main (http://127.0.0.1:3030/SandBox/web/sandbox.dart:26:14)
Here's a simple app to reproduce the issue on Dart Editor/Dartium:
import 'package:angular/angular.dart';
@NgFilter(name: 'test_filter')
class TestFilter {
String call(String str) {
return str.toUpperCase();
}
}
@NgController(
selector: '[simple]',
publishAs: 'ctrl')
class SimpleController {
String testVar = "mehmetf";
List<String> testList = new List()..add("test2")..add("test3");
}
class SandboxModule extends Module {
SandboxModule() {
type(TestFilter);
type(SimpleController);
}
}
void main() {
ngBootstrap(module: new SandboxModule());
}sandbox.html:
<html ng-app>
<head>
<meta charset="utf-8">
<title>SandBox</title>
<link rel="stylesheet" href="sandbox.css">
</head>
<body simple>
<h1>SandBox</h1>
<span ng-bind-html="ctrl.testVar | test_filter"></span> <!-- This does not work -->
<span ng-repeat="sth in ctrl.testList">{{sth | test_filter}}</span> <!-- This works -->
<script type="application/dart" src="sandbox.dart"></script>
</body>
</html>