Wie bekomme ich den ui-sref von ui-router, der in der Vorlage einer Direktive liegt?

Question

Grundsätzlich versuche ich, das Verhalten des ui.bootstrap.accordion zu ändern/anzupassen. Alles funktioniert, außer der Integration mit dem UI-Router.
Hier ist die Art, wie ich das Akkordeon verwenden mag:

<accordion> <!-- this element is actually separate view in a parent state of the accordion-group's below.--> 
    <accordion-group ui-sref="site.home.newsID_1"> <!-- accordion-groups will be generated with ng-repeat.--> 
     <accordion-heading> 
     News 1 
     </accordion-heading> 
     <p>This is</p> 
    </accordion-group> 
    <accordion-group ui-sref="site.home.newsID_2"> 
     <accordion-heading> 
     News 2 
     </accordion-heading> 
     <p>Home News's</p> 
    </accordion-group> 
    <accordion-group ui-sref="site.home.news.newsID_3"> 
     <accordion-heading> 
     News 3 
     </accordion-heading> 
     <p>Preview and navigation</p> 
    </accordion-group> 
    </accordion> 

Im Folgenden ist die modifizierte Vorlage des Akkordeons:

<div ng-mouseenter="isOpen = !isOpen" ng-mouseleave="isOpen = !isOpen"> 
    <div class="accordion-group" ng-class="{transparentBackground: isClicked}"> 

     <div class="accordion-heading"> 
     <a id="link" ui-sref="site" class="accordion-toggle" ng-click="isClicked = !isClicked" accordion-transclude="heading"> 
      {{heading}} 
     </a> 
     </div> 

    <div class="accordion-body" collapse="!isOpen && !isClicked"> 
     <div class="accordion-inner" ng-transclude></div> </div> 
    </div> 
</div> 

Grundsätzlich ist die Notwendigkeit, ‚site.home.newsID_X‘ den ‚Standort‘ zu ersetzen Wert von ui-sref innerhalb der Vorlage.
Mein Versuch, den Wert von ui-sref Attribute über die ‚Element‘ Parameter aus der Verknüpfungsfunktion der accordionGroup Richtlinie wie unten gezeigt eingestellt war: das Ziel ui-Sref,

link: function(scope, element, attrs, accordionCtrl) { 
    element.find('#link').attr("ui-sref", attrs.uiSref) 
    [...] 
} 

aktualisiert Dies tut aber UI- Router nicht die entsprechende href aus der uRL des Staates verwiesen erzeugen, so dass nach dem DOM gemacht wird erhalte ich

<a ui-sref="site.home.newsID_1" href="#/site"></a> 

statt der erwarteten

<a ui-sref="site.home.newsID_1" href="#/site/home/newsID_1"></a> 

Was fehlt mir?
ich Ihre Zeit zu schätzen wissen,
Jared

Answer 1

Ok, ich habe mein Problem gelöst. Es scheint, dass ich Zustände mit URLs verwechselte.
eine Verbindung mit ui-Sref wird Zustandsänderung an einen gegebenen Zustand auszulösen und die Änderung gegebenenfalls wird/die URL erzeugen, wenn man in dem Zustand definiert ist. Auch Staaten selbst haben keine Parameter, aber URLs tun.
Hier ist mein Verständnis eines Staates:
Ein Zustand, in ui-Router in einen Zustand der Website in einer bestimmten HTML-Template definiert bezieht. Diese Vorlage kann ui-Ansichten definiert haben, d. H. Platzhalter (die benannt werden können), die von anderen Zuständen ausgefüllt werden. Jeder Staat kann auf eine oder mehrere Benutzeransichten innerhalb der Vorlage anderer Staaten mit entsprechenden HTML-Vorlagen abzielen, d. H. Sie können den Inhalt dieser Vorlagen in Benutzeransichten anderer Ländervorlagen einfügen. Jeder Status kann eine verknüpfte URL haben, die die URL im Browser mit dem Status verknüpft. Wenn die URL im Browser mit der URL übereinstimmt, die mit einem bestimmten Status verknüpft ist, ändert sich der Status der Website, dh der neue Status füllt referenzierte ui-views in anderen Statusvorlagen mit Inhalten von Vorlagen, die an Ansichten im aktuell aktiven Zustand gebunden sind .
URLs folgen der Hierarchie von Zuständen, sind aber unabhängig von ihnen. Daher kann ein Status 'site.home' eine URL von '/ home/content' haben, die an eine URL angehängt wird, die dem übergeordneten Status ('site') zugeordnet ist. , es sei denn, es wird ausdrücklich nicht gesagt.
daher eine Zustandsänderung/Übergang kann entweder von dem ui-Sref oder durch Änderung der URL über href Link oder manuell in dem Browser durch den Benutzer ausgelöst werden. Eine weitere Möglichkeit,
Zustandsänderung auszulösen intern (für EGZ. In einer Steuerung, die auch für jeden Zustand definiert werden kann) ist es, den $ state.go (...) Verfahren zu verwenden.
, dass das Verständnis, änderte ich einfach die ui-sref Referenzen Urls href. Obwohl dies keine direkte Lösung für mein Problem ist, und ich immer noch nicht verstehe, warum ui-router keine entsprechenden hrefs erzeugt, sorgt es dafür, dass die Dinge wie erwartet funktionieren. Ich bin immer noch auf die Verwendung von $ state.go() um mein Ziel zu erreichen.

Answer 2

Ich bin mir nicht sicher, ob es neu ist oder nicht, aber es gibt eine Möglichkeit, Parameter zu übergeben, wenn Sie ui-sref verwenden. In Ihrem Fall wäre es so etwas wie diese:

ui-sref="site.home.news({ newsID: news.id })" 

(für einen site.home.news Zustand in Sie app, mit einem newsID Parameter in seinem entsprechenden URL und news.id verweist auf die Nachrichten-ID in den aktuellen $scope Berücksichtigung)

Siehe Dokumentation here.