CODEWITHSUNDEEP
angularjsangularjs-filter
slevin
slevin

Reputation: 3896

cannot manipulate string with angular filter

I am an angular newbie and I study the book "Angular JS by example" and I try to create my own filter. (pp. 93-94).

In my controller this is the string I want to manipulate procedure: "Assume a position, with feet together .\Slightly bend your knees, .\While in air, bring your legs out .\ As you are moving your legs outward"

and then I sanitise it

$scope.trustedHtml = $sce.trustAsHtml($scope.currentExercise.details.procedure);

Since this is an SPA , the filter is in the description-panel.ejs file, that is inside workout.ejs, that is inside index.ejs

description-panel.ejs has

<div class="panel-body" ng-bind-html ="trustedHtml | myLineBreakFilter"> </div>

workout.ejs has

<div id="video-panel" class="col-sm-3" ng-include="'description-panel.ejs'">

and index.ejs has

<script src="/javascripts/7MinWorkout/filters.js"></script>

filter.js has the filter

angular.module('7minWorkout').filter('myLineBreakFilter', function () {
    return function (input) {
        var str = input;
        var br = "</br></br>";
        var position = str.indexOf(".");

        var output = [str.slice(0, position), br, str.slice(position)].join('');    

        return output ; 
    }
});

The filter should replace all the . with </br></br>.

This does not work and I get no text at all in my front-end. I get this error in the console

TypeError: str.slice is not a function  at filters.js:22

Shouldn't basic js stuff like str.slice be supported out of the box? What am I missing?

Thanks

Upvotes: 0

Views: 189

Answers (2)

Mahantesh Kumbar
Mahantesh Kumbar

Reputation: 255

Try this add this before the splice

str.toString();
str.splice(//pass parameters);

Upvotes: 0

Juned Lanja
Juned Lanja

Reputation: 1484

$sce.trustAsHtml() return you an object so slice will not work on it.You can pass that object to $sce.getTrustedHtml(object) to obtain the original value and then can apply slice on it.

    angular.module('7minWorkout').filter('myLineBreakFilter', function ($sce) {
return function (input) {

var str = $sce.getTrustedHtml(input);
var br = "</br></br>";
var position = str.indexOf(".");

var output = [str.slice(0, position), br, str.slice(position)].join('');    

return $sce.trustAsHtml(output) ; 
}
});

Upvotes: 1

Related Questions