Question

我试图做这个指令，它不能像我预期的那样工作..

<nForm nform="tabs"></nForm>

directive('nForm',['$injector', function($injector){
     return {
        restrict: 'E',
        require: 'ngModel',
        template: "<div class='form-object'></div>",
        link: function(scope, element, attrs) {
           //some more code
        }
      };
])

在以下情况下无效：

<class="nForm" nform="tabs"></nForm>

directive('nForm',['$injector', function($injector){
     return {
        restrict: 'C',
        require: 'ngModel',
        template: "<div class='form-object'></div>",
        link: function(scope, element, attrs) {
           //some more code
        }
      };
])

的工作原理。我做错了什么？

Answer 1

AngularJs在命名指令及其用法时遵循严格的风格。

每个带大写字母的单词都应该用＆＃39; - ＆＃39;。

分隔

例如下面的指令声明

.directive('myCustomer', function() {
    //...
});

应该用作

 <my-customer ></my-customer>

在你的情况下它应该是

<n-form> <n-form>

这种转换的原因是，虽然JavaScript区分大小写，但HTML不是。因此，angular会在内部重命名标记引用，以便保留每个环境中的约定。

Answer 2

你应这样写：

<class="nForm" n-form="tabs"></nForm>

指令名称“nForm”意味着在html中它应该写成“n-form”（因为大F）

角度指令不限制为A和E.

2 个答案: