0

Is there any way to allow my directives in WordPress post? Like:

app.directive('postMeta', function() {
return {
    restrict: 'E',
    template: 'post meta template:'
};});

In my post, I write

<post-meta></post-meta>

It does nothing too. Some easy syntax like

{{ 3 + 2 }}

Do nothing too, just echo {{ 3 + 2 }}. All these tags in template works well.

P.S. template like this:
https://github.com/1fixdotio/angularjs-demo-theme

Script.js:

    app.config(['$routeProvider', '$locationProvider', function($routeProvider, $locationProvider) {
    ...
    $routeProvider.when('/:slug', {
            templateUrl: myLocalized.partials + 'content.html',
            controller: 'Content'
        })
        ...
    app.controller('Content', ['$scope', '$routeParams', '$http', '$compile', function($scope, $routeParams, $http, $compile) {
            $http.get('wp-json/posts/?filter[name]=' + $routeParams.slug).success(function(res){
            $scope.post = res[0];
            $compile($scope.post.content)($scope);
        })
...
app.directive('postMeta', function() {
    return {
        restrict: 'E',
        replace: true,
        template: '<div>template of postMeta directive</div>',
        controller: function($attrs, $scope) {
            $scope.test = 'test in controller';
            console.log('attrs = ' + $attrs.description);
        },
        link: function(scope, element) {
                    console.log('inside link ');
            }
    };
});

Inside wp post:

Uncategory blog 2 {{ 2 + 3 }}
<post-meta description="My description in post">{{test}}</post-meta>

Outside:
http://postimg.org/image/mfeytefhb/

Pang
  • 9,564
  • 146
  • 81
  • 122
Melifaro
  • 1
  • 1
  • 2
  • 2
    Assuming this is being entered through editor in back end, does the tag still exist? Is angular being bootstrapped? Really not much information to work from in your question – charlietfl Aug 19 '15 at 23:47
  • add this after `template: post meta-template, controller: function($scope) { $scope.test = 'testing directive}'` And in your view add `{{test}} inside `` and see if that works, otherwise you may have some other issue – Babajide Fowotade Aug 19 '15 at 23:49
  • After this it's just echo {{ test }} to page, but. I modified my directive to this `app.directive('postMeta', function() { return { restrict: 'E', replace: true, template: 'template of postMeta directive', controller: function($attrs, $scope) { $scope.test = 'test in controller'; console.log('attrs = ' + $attrs.description); }, link: function(scope, element) { console.log('inside link ' + scope.post); } }; });` and add in contentController `$compile($scope.post.content)($scope);` - functions of directive work, template - not :( – Melifaro Aug 20 '15 at 10:45
  • `ng-bind-html` doesn't compile angular expressions or directives – charlietfl Aug 20 '15 at 12:24
  • thx... found answer at http://stackoverflow.com/questions/19726179/how-to-make-ng-bind-html-compile-angularjs-code – Melifaro Aug 20 '15 at 13:43

0 Answers0