javascript - AngularJs 指令问题

Question

我创建了两个指令并将它们包含在我的 html 中。但是，只有第一个执行，之后什么也没有执行。

<div ng-app="myApp">
    <div ng-controller="MyCtrl">
        <div directive-one=""/> 
        <div directive-two=""/>
        <div> Hello I am {{name}} and I am {{age}} years old!</div>
    </div>

    <script type="text/ng-template" id="myTemplate.html">
        <div>Name: <input type='text' ng-model='name'/></div>
    </script>
</div>

Javascript:

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

app.controller('MyCtrl', function ($scope) {
    $scope.name = "Jason";
    $scope.age = "20";
});

app.directive('directiveOne', function () {
    return {
        replace: true,
        template: "<div>Age: <input type = 'text' id = 'age' ng-model='age'>
                  </input></div>"
    }
});

app.directive('directiveTwo', function () {
    return {
        replace: true,
        templateUrl: "myTemplate.html"
    }

});

这是 fiddle :DEMO

无法弄清楚是什么问题。任何帮助表示赞赏。

Answer 1

您必须使用其中的指令关闭您的 div 标签，并且您不需要在任何一个之后加上 =""。

<div directive-one></div> 
<div directive-two></div>

Here's an updated fiddle with it working.