Use scope in filter angularjs

Question

I'm trying to create filter that will watch safe and try to use $compile on variable

Right now I can use this with no problem

.directive('safe', ['$compile',
    function ($compile) {
      return function (scope, element, attrs) {console.log(scope, element, attrs)
        scope.$watch(
          function (scope) {
            // watch the 'safe' expression for changes
            return scope.$eval(attrs.bindUnsafeHtml);
          },
          function (value) {
            // when the 'safe' expression changes
            // assign it into the current DOM
            element.html(value);

            // compile the new DOM and link it to the current
            // scope.
            // NOTE: we only compile .childNodes so that
            // we don't get into infinite loop compiling ourselves
            $compile(element.contents())(scope);
          }
        );
      };
    }
  ])

The usage for above code in the html file is

<span safe="'_agree_to_terms_and_conditions_'">

Now I want to be able to do something like this instead

 {{ gettext("_agree_to_terms_and_conditions_" | safe }}

Now when I try to create filter I don't have scope available in there...

Is it even possible to acheive something like above?

PS. The name of the filter needs to match exactly like the given example since I'm trying to create a common usage of the function with different app for i18n.

Possible duplicate of [Access scope variables from a filter in AngularJS](http://stackoverflow.com/questions/17596246/access-scope-variables-from-a-filter-in-angularjs) — Icarus, Mar 21 '17 at 13:17

score 0 · Answer 1 · edited May 23 '17 at 12:25

0

This seems like a bad idea. From a filter, you wouldn't want to try and modify the $scope in any ways. You'll probably get errors about being in a $digest cycle already. But it is possible to pass things into the filter.

{{ gettext("_agree_to_terms_and_conditions_" | safe:this }}

app.filter('safe', function () {
   return function (input, scope) {
     //scope will be *this* that you passed in from the HTML
   };
});

Just found an article where this has been asked before: Access scope variables from a filter in AngularJS. They also give similar warnings about not trying to modify the $scope.

edited May 23 '17 at 12:25

Community

1
1

answered Apr 08 '14 at 21:11

EnigmaRM

7,523
11
46
72

Thank you so much! I'm only struggling right now on how to be able to just do `{{ gettext("_agree_to_terms_and_conditions_" | safe:this }}` without having to add `:this` to the filter :( – Ali Apr 08 '14 at 21:19
Not sure what you mean by that comment. You don't want to add `this` to the filter? or you're struggling to figure out how to make it work. – EnigmaRM Apr 09 '14 at 15:42
Sorry. I meant not adding `this` to the filter. – Ali Apr 09 '14 at 20:05
I don't think you can access `$scope` within a filter. It's still not really clear what you're trying to accomplish. Just seems like a filter is the wrong way to go about it. It should be done as a directive. – EnigmaRM Apr 09 '14 at 20:18

Use scope in filter angularjs

1 Answers1