2017-11-22 15 views
2

クラスm-menu__toggleの要素を持つmetronicテンプレートのプロジェクトbasecに取り組んでいます ハイフンとアンダースコアのために、このディレクティブの名前を明確にしていません。クラスm-menu__toggleを持つ要素のangularjsディレクティブを定義するにはどうすればよいですか?

以下は動作しません:

import angular from 'angular'; 

const module = angular.module('app.directives.menuToggle', []); 

module.directive('m-menu__toggle', function() { 
    return { 
    restrict: 'C', 
    link: function(scope, elem, attrs) { 
     elem.css('color', 'red'); 
     elem.css('border', '1px solid red'); 
     elem.css('cursor', 'help'); 
    } 
}; 
}); 

export default module.name; 

答えて

2

続くハイフンに変換されます。下記の作業スニペットを参照してください。

(function() { 
 
    angular 
 
    .module('app', []) 
 
    .directive('mMenuToggle', fun); 
 

 
    function fun() { 
 
    return { 
 
     restrict: 'C', 
 
     link: function(scope, elem, attrs) { 
 
     elem.css('color', 'red'); 
 
     elem.css('border', '1px solid red'); 
 
     elem.css('cursor', 'help'); 
 
     } 
 
    } 
 
    } 
 

 
})();
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
 

 
<div ng-app="app"> 
 
    <span class="m-menu__toggle"> Element </span> 
 
</div>

なぜここを参照してください:私はそれが動作しません... AngularJS(1.2.23)でこれをテストしたAngular directive name: only lower case letters allowed?

1

あなたのディレクティブ名があることwuold「mMenu__toggle」原因キャメルケースは、あなたがあなたのディレクティブmMenuToggleに名前を付ける必要がある小文字

+0

。デモを提供できますか? – lealceldeiro

関連する問題