JSFiddle - React, Tailwind, and code Playground

HTML

<div ng-app="myApp">
    <div ng-controller="testCtrl">
        
        // с директивой
        <div in-tags text="{{ model.text }}"></div>
        
        <hr/>
        
        // без директивы
        <p ng-repeat="item in model.text | splitByWords">
            {{ item }}
        </p>
    </div>
</div>

JavaScript

angular
    .module('myApp', [])

    .controller('testCtrl', function($scope){
        var model = $scope.model = {
            text: 'уголь патриарх трансплантация'
        };
    })

    .directive( 'inTags',function() {
        return {
            scope: {
                text: '@'
            },
            template: '<p ng-repeat="item in text | splitByWords">{{ item }}</p>'
        };
    })

    .filter( 'splitByWords', function() {
        return function( text ) {
            return text.split( /\s+/ );
        };
    });