2013-11-27 3 views
1

При запуске следующего кода он должен быть сфокусирован (например, на кнопке на кнопке) на кнопке с указанным фокусом, показанным здесь. Но ее не работаетПользовательские директивы не работают в Angular js

enter image description here

Html код:

<body ng-controller="TextController"> 
<button ng-click="clickUnfocused()">Not focussed</button> 
<button ngbk-focus ng-click="clickfocused()">focussed</button> 
<div>{{message.text}}</div> 
</body> 

Javascript код:

var kitkatmodule = angular.module('Kitkat', ['directives']); 

    kitkatmodule.controller('TextController',function($scope) { 

     $scope.message = {text:"nothin clicked"}; 

     $scope.clickUnfocused = function() { 
     $scope.message.text = "Click Unfocused"; 
     } 
     $scope.clickfocused = function() { 
     $scope.message.text = "clickfocused"; 
     } 
    }); 

    kitkatmodule.directive('ngbkFocus', function(){ 
     return { 
      link : function(scope, element, attrs, controller) { 
       element[0].focus(); 
      } 
     }; 
    }); 

Как это исправить

+0

Можете ли вы показать свою разметку для 'ng-app'. Ошибка говорит 'Kitkatty', где ваше имя модуля является« Kitkat ». –

+0

@Davin Я отредактировал мой код, который вы можете попробовать сейчас –

ответ

0

при работе с директивами необходимо добавить угловой resource.js файлу

0

Вам не нужно вводить «директивы 'в ваш модуль, если вы не собираетесь вводить новый модуль для директива позже. Ваш контроллер также должен быть объявлен аналогично этому примеру:

function TextController($scope) { 
    $scope.name = 'Superhero'; 
} 
+0

Смотрите эту рабочую скрипку: http://jsfiddle.net/a7EhG/. Просто убедитесь, что вы используете ng-app = "kitkat", где вы его объявляете. – C1pher

+1

'kitkatmodule.controller ('TextController', function ($ scope) {' is IMHO - лучший способ определить контроллер. Ваша глобальная функция. –

+0

@ C1pher Я редактировал свой код со своей скрипки. (ngbk-focus) не работает. Я ничего не теряю? –

0

Просто удаление «directives» вы включили декларируя модуль заставляет код работать. Также позаботьтесь, что вы объявили ng-App. Я не включил angular-resources.js, но все же это работает для меня. Только что включили angular.min.js.

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