我正在尝试角度指令，我很困惑。
我有四个指令：person、personWholeName、personFirstName 和 personLastName。person 调用 personWholeName 指令。personWholeName 调用 personFirstName 和 personLastName 指令。但是当我使用 person 指令时，我没有看到 personLastName 指令被渲染。
这是我的html：
<script type="text/ng-template" id="partials/personFirstName.html">
<span>{{first}}</span>
</script>
<script type="text/ng-template" id="partials/personLastName.html">
<span>{{last}}</span>
</script>
<script type="text/ng-template" id="partials/personWholeName.html">
<div>
<person-first-name first="name.first" />
<person-last-name last="name.last" />
</div>
</script>
<script type="text/ng-template" id="partials/person.html">
<div>
<person-whole-name name="person.name" />
</div>
</script>
<div ng-controller="MainAppController">
First Name: <input type="text" ng-model="person.name.first" /><br/>
Last Name: <input type="text" ng-model="person.name.last" /><br/>
<person person="person" />
</div>
然后是我的脚本：
'use strict;'
var mainApp = angular.module('mainApp', ['personModule'])
.controller('MainAppController', function MainAppController($scope) {
$scope.person = {
name: {
first: "John",
last: "Smith"
}
};
});
var personModule = angular.module('personModule', []);
personModule.directive('personFirstName', function() {
return {
restrict: 'E',
replace: true,
templateUrl: 'partials/personFirstName.html',
scope: {
first: '='
}
};
});
personModule.directive('personLastName', function() {
return {
restrict: 'E',
replace: true,
templateUrl: 'partials/personLastName.html',
scope: {
last: '='
}
};
});
personModule.directive('personWholeName', function() {
return {
restrict: 'E',
replace: true,
templateUrl: 'partials/personWholeName.html',
scope: {
name: '='
}
};
});
personModule.directive('person', function() {
return {
restrict: 'E',
replace: true,
templateUrl: 'partials/person.html',
scope: {
person: '='
}
};
});
关于为什么不呈现姓氏的任何想法？