リスト内の通知ウィジェットのフレームとして機能するラッパー ディレクティブを作成したいと考えています。そのフレームでは、後でオブジェクトのプロパティに基づいて特定のコンテンツをトランスクルージョンしたいと考えていnotif
ます。現在、要素をハードコーディングしていdiv
ます。
私は index.cshtml に以下を持っています:
<div ng-controller="notificationCenterCtrl">
<ul>
<li ng-repeat="notif in allNotifications">
<notification-base notification="notif" remove="removeNotification(notif)">
<div style="background-color: fuchsia">bla bla</div>
</notification-base>
</li>
</ul>
</div>
これはディレクティブの仕様です:
ns.directive("notificationBase", function() {
return {
restrict: 'E',
replace: true,
transclude: true,
templateUrl: '/Scripts/notification-base.html',
controller: 'notificationBaseCtrl',
scope: {
notification: '=',
removeNotif: '&remove'
}
};
});
次のように機能するのはなぜdiv
ですか?
<div>
My notification title: {{notification.name}}
<div ng-transclude id="notificationContent">
</div>
<a ng-click="remove()">Remove</a>
</div>
...しかし、要素のように使用すると、フクシアの div が表示されなくなります。
<div>
My notification title: {{notification.name}}
<div id="notificationContent">
<ng-transclude></ng-transclude>
</div>
<a ng-click="remove()">Remove</a>
</div>
ng-transclude
属性または要素として使用する場合の違いは何ですか。(私はFirefoxを使用しています)。