Ich habe folgende Richtlinie:
<div teamspeak details="{{data.details}}"></div>
Dies ist die Objektstruktur:
data: {
details: {
serverName: { type: 'text', value: 'my server name' },
port: { type: 'number', value: 'my port' },
nickname: { type: 'text' },
password: { type: 'password' },
channel: { type: 'text' },
channelPassword: { type: 'password' },
autoBookmarkAdd: { type: 'checkbox' }
}
}
und ich möchte, dass es einen Link basierend auf den Daten innerhalb des data.details
Objekts generiert .
Leider funktioniert es nicht, da ich irgendwie nicht auf innere Werte des details
Objekts zugreifen kann , aber wenn ich es übergebe, eine einfache Datenstruktur wie:
<div teamspeak details="{{data.details.serverName.value}}"></div>
Ich kann mit darauf zugreifen {{details}}
.
Hier ist mein Richtliniencode:
App.directive('teamspeak', function () {
return {
restrict: 'A',
template: "<a href='ts3server://{{details.serverName.value}}:{{details.port.value}}'>Teamspeak Server</a>",
scope: {
details: '@details',
},
link: function (scope, element, attrs) {
}
};
});
Vielen Dank
object = '='
zuweisen , kann ich dies nicht tun , da Sie einem Typobjekt keine Zeichenfolge zuweisen könnenObjectType
. Irgendwelche Vorschläge, wie das mit TypeScript geht?Jemand fragte, wie es geht, ohne den Umfang zu isolieren. Hier ist eine Lösung:
<div teamspeak details="{{data.details}}"></div>
App.directive('teamspeak', function () { return { restrict: 'A', template: "<a href='ts3server://{{details.serverName.value}}:{{details.port.value}}'>Teamspeak Server</a>", link: function (scope, element, attrs) { if(attrs.details){ scope.details = scope.$eval(attrs.details); } } }; });
Wir können sogar verwenden,
$interpolate
wenn Werte inattrs.details
dynamisch mit eckigen {{...}} Ausdrücken festgelegt werden sollen ...scope.details = scope.$eval($interpolate(attrs.details)(scope));
(Vergessen Sie nicht, den
$interpolate
Dienst in Ihre Richtlinie aufzunehmen.)Wichtiger Hinweis: Ich habe diese Methode nicht mit Winkel 2 getestet.
quelle