2015-10-26 2 views
0

Here - это простое угловое приложение. Он отображает/скрывает текст, основанный на нажатии пользователем кнопки.Какова область применения шаблонов в директиве без контроллера

<div ng-controller="exampleController as ctrl"> 
    <example></example> 
</div> 


app.controller('exampleController', function() {}); 
app.directive('example', function() { 
    return { 
    restrict: 'E', 
    template: '<p ng-show=\"showMe\">Text to show</p><button ng-click=\"clickMe()\">Click me</button>', 
    scope: {}, 
    link: function (scope) { 
     scope.clickMe = function() { 
      scope.showMe = !scope.showMe; 
     }; 
    } 
    }; 
}); 

Когда я удаляю контроллер, он не работает. Обратите внимание, что директива создает область изоляции, поэтому я понимаю, что она не зависит от области контроллеров.

<div> 
    <example></example> 
</div> 

app.directive('example', function() { 
    return { 
    restrict: 'E', 
    template: '<p ng-show=\"showMe\">Text to show</p><button ng-click=\"clickMe()\">Click me</button>', 
    scope: {}, 
    link: function (scope) { 
     scope.clickMe = function() { 
      scope.showMe = !scope.showMe; 
     }; 
    } 
    }; 
}); 

Что здесь не так?

ответ

1

Но в любом случае вы должны иметь нг-приложение

<body ng-app="demo"> 
    <div> 
     <example></example> 
    </div> 
</body> 

var app = angular.module("demo", [])  

app.directive('example', function() { 

    return { 
     restrict: 'E', 
     template: '<p ng-show=\"showMe\">Text to show</p><button ng-click=\"clickMe()\">Click me</button>', 
     scope: {}, 
     link: function (scope) { 
      scope.clickMe = function() { 
       scope.showMe = !scope.showMe; 
      }; 
     } 
    }; 
}); 

Fiddle

+0

Пропущенный что полностью :) Спасибо за помощь. Я с ума сходил! –

Смежные вопросы