在angularJs中创建指令

在angularJs中创建指令

我正在尝试在angularJS中创建指令。但这不起作用。我所做的如下。

我的主要html代码

<body ng-app="birthdayToDo" ng-controller="main">
    <h1>Hello Plunker!</h1>
    <myCustomer></myCustomer>
  </body>


我的Js代码:

var app = angular.module('birthdayToDo', []);

app.controller('main', function($scope) {
  $scope.employees=[
                    {
                      Name:"Amit",
                      Email:"[email protected]"
                    },
                    {
                      Name:"Ajay",
                      Email:"[email protected]"
                    },
                    {
                      Name:"Rahul",
                      Email:"[email protected]"
                    },
                    {
                      Name:"Aakash",
                      Email:"[email protected]"
                    },
                    {
                      Name:"Rohit",
                      Email:"[email protected]"
                    },
                  ];

});
app.directive('myCustomer', function() {
    var directive = {};

    directive.restrict = 'E'; /* restrict this directive to elements */
    directive.templateUrl = "directiveFile.html";

    return directive;
  });


我的directiveFile.html代码

<table>
  <tr>
    <td>SNo.</td>
    <td>Name</td>
    <td>Email</td>
  </tr>
  <tr ng-repeat="employee in employees">
    <td>{{$index+1}}</td>
    <td>{{employee.Name}}</td>
    <td>{{employee.Email}}</td>
  </tr>
</table>


但是此代码不起作用。我在做什么错

Plunker link

最佳答案

您有2种命名方式:

1。

app.directive('myCustomer', function()
<my-customer> </my-customer>


2。

app.directive('mycustomer', function()
<mycustomer>  </mycustomer>

关于javascript - 在angularJs中创建指令,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/27817818/

10-10 07:56