Question

我是AngularJS的新手。我从侧面复制并将其粘贴到我的工作文件中，创建了我的第一个名称为my-customer的自定义指令。当我尝试自己构建它时，我看到了奇怪的行为，因为如果我尝试使用my-customer访问指令，它就不会在屏幕上显示任何内容。

test.directive('my-customer',function(){
code...
}

当我看到原始示例时，作者使用myCustomer名称访问相同的指令。如何将html属性的角度转换为指令名称。因为如果我尝试使用mycustomer，它仍然一无所获。如果控制器的名称中有多个-，如my-customer-a

<div ng-app="myapp">

            <div ng-controller="Controller">
                <div id="test" my-customer></div>
            </div>


        </div>


var test = angular.module('myapp', [])
.controller('Controller', ['$scope', function($scope) {
  $scope.customer = {
    name: 'Naomi',
    address: '1600 Amphitheatre'
  };
}]);
test.directive('myCustomer',function(){

    return{

        template:'Name :{{customer.name}} Address: {{customer.address}}'
    }
});

Answer 1

Angular在内部将此my-customer代码转换为camelCase 在这种情况下，多个-将转换为camelCase 例如：my-name-is-intekhab将转换为myNameIsIntekhab

您也可以使用:或data-

这是来自Angular网站

规范化过程如下：

从元素/属性的前面剥离x-和data-   将：， - 或_分隔的名称转换为camelCase。

AngularJS：奇怪的自定义指令

1 个答案: